﻿/*このページ専用の CSS レイアウト*/
/*asp.net では、IDは、ctl00_cphContent_dl のように書き換えられる*/

.out_frame{position:relative;margin:0 auto;width:100%;padding:0px}

.pnlTop{margin-left:5px;margin-right:5px;}
.navi_line{width:100%;height:2em;text-align:right;font-size:0.8em;letter-spacing:1px}
.navi_line img{vertical-align:middle;width:23px;}

h1#navi_btn{font-size:1.2em;display:inline-block;height:2em;margin:0.5em 0 0 0;padding:0.5em 0.3em 0 0.3em;text-align:center;letter-spacing:1px;font-weight:bold;z-index:2}
/*h1#navi_btn{font-size:1.2em;width:21em;height:2.3em;margin:0.5em 0 0 0;padding:0.2em 0 0 0;text-align:center;letter-spacing:1px;font-weight:bold;z-index:2}*/
#topImg{margin:10px 0px;width:100%;}

#topList{list-style-type:none;margin:10px 0px 5px 0px;padding:0px;}
#topList li {text-align:center;}
#topList li h2{text-align:left;font-size:1.1em;border:0px;letter-spacing:1px;border-bottom:solid 1px #DDD;margin:0.9em 0;font-weight:bold;}
#topList li p{text-align:left;list-style-type:none;letter-spacing:1px;margin:1em 0 1em 2em;font-size:1em;}
#topList ol li{text-align:left;margin-left:25px;}
#topList ul li{text-align:left;margin-left:25px;}

@media screen and (max-width:360px){
    #topList img[class*="216"]{width:144px;}
}
@media screen and (min-width:361px){
    #topList img[class*="216"]{width:216px;}
}

/*　^---で始まる。*---を含む。　$---で終わる*/
#topList  img[class^="R"] {float:right;margin-left:5px;border:0px;}
#topList  img[class^="L"] {float:left;margin-right:5px;border:0px;}
#topList  img[class*="144"] {width:144px}


#pnl_copy{margin:0px;font-size:1.2em;letter-spacing:1px;padding:5px 0px 0px 5px}
#pnl_img{width:307px;height:56px;margin:0px;background-color:#FFFFFF;}




/*大きい画像*/
.big_image img{width:315px;margin:0px auto;line-height:0;padding:0px;border:0px;}

/*マクロ画像*/
.macro_image{margin:0px;line-height:0;padding:0px;border:0px;}
.macro_image img{width:96px;height:72px;border:0px;margin:1px;padding:0px}

/*画面操作ボタン*/
#div_btn{width:310px;margin:5px auto}
#div_btn_left{float:left;width:100px;text-align:left}
#div_btn_right{float:right;width:100px;text-align:right}
#div_btn img{width:80px}
#div_btn_center{margin:0px 105px;width:100px;text-align:center}
         

/*商品説明 BOX*/
.dl_box{width:95%;margin:0px auto;line-height:normal}

/*計算 BOX*/
/*
.cal_box{width:300px;letter-spacing:1px;margin:0px auto;font-size:0.9em;line-height:normal}
.cal_box table{width:300px;border:1px solid #444444;border-collapse:collapse;}
.cal_box th{width: 70px; text-align: left;padding:3px;color:#DDDDDD;background-color:#555555}
.cal_box th a{color:#DDDDDD}
.cal_box td{width:230px; text-align: left;padding:3px;}
.cal_box divBtnGray{width:300px;text-align:left;font-size:0.85em;letter-spacing:1px;background-color:#EEEEEE;padding:0px;margin:10px 0px}
.cal_box hr{border:1px dashed #333333;width:100%;}
*/

/*.radius{width:100%;letter-spacing:1px;margin:0px auto;font-size:1em;line-height:normal}*/
table.order_table{width:95%;border-collapse:collapse;margin:10px auto;border:1px solid #DDDDDD}
table.order_table th{width: 17%; text-align: left;padding:3px;color:#DDDDDD;background-color:#555555;margin:0px}
table.order_table th a{color:#DDDDDD;text-decoration:underline}
table.order_table td{width:83%; text-align: left;padding:3px;margin:0px}
table.order_table divBtnGray{width:300px;text-align:left;font-size:0.85em;letter-spacing:1px;background-color:#EEEEEE;padding:0px;margin:10px 0px}
table.order_table hr{border:1px dashed #333333;width:100%;}

/*
.right_box hr{border-style:dotted;width:370px;border-color:#999999;border-width:1px;}
*/
hr{border-style:dotted;border-color:#999999;border-width:1px;}



/* 角丸白ボタン*/
.btnGray {
    
    /*margin: 5px 0px 5px 0px;*/

    /*padding: 0.2em 0 0 0;*/
    padding: 0.2em 0.2em 0.1em 0.2em;

    /*font-size: 0.9em;*/
    font-size: 1em;

    /*line-height: 1.5em;*/

    letter-spacing:1px;
}

.nowrap{white-space:nowrap;}

.table_overview {
	margin:20px;
	padding:0px;
	width:100%;
/*	border-top-width:1px;
	border-top-style:solid;
	border-top-color:#DDDDDD;
*/
	}

.table_overview th {
	width:20%;
	font-weight:normal;
	text-align:left;
	background-color: #F6F6F6;
	padding-top: 7px;
	padding-right: 10px;
	padding-bottom: 7px;
	padding-left: 17px;
	background-position: left center;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #DDDDDD;
}

.table_overview td {
	width:80%;
	background:#FFF;
	padding-top: 7px;
	padding-right: 5px;
	padding-bottom: 7px;
	padding-left: 5px;
	/*line-height: 17px;*/
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #DDDDDD;
}