@charset "utf-8";
/* CSS Document */


/* テキスト */

.tx_s{
	font-size:0.875em/*14px*/
}
.tx_xs{
	font-size:0.75em;/*12px*/	
}
.tx_l{
	font-size:1.125em;/*18px*/	
}

.tx_xl{
	font-size:1.25em;/*20px*/	
}
.tx_s_red{
	font-size:0.875em;
	color:#900;	
}
.tx_green{
	color:#660;	
}

/* マージン */
.ma05{
	margin:0.5em;	
}
.ma1{
	margin:1em;	
}
.ma2{
	margin:2em;	
}
.ma_t_1{
	margin-top:1em;	
}
.ma_t_2{
	margin-top:2em;	
}
.ma_l_1{
	margin-left:1em;	
}
.ma_l_3{
	margin-left:3em;	
}
.ma_r_1{
	margin-right:1em;	
}
.ma_r_2{
	margin-right:2em;	
}
.ma_r_3{
	margin-right:3em;	
}
.ma_b_1{
	margin-bottom:1em;	
}
.ma_b_2{
	margin-bottom:2em;	
}
.ma_b_3{
	margin-bottom:3em;	
}


/* パディング */
.pa_l_3{
	padding-left:3em;	
}


/* リスト */
.li_hishi{
	list-style-image:url(img_common/li_hishi.jpg);	
}

.li_nav{
	list-style:none;
	margin:1em 0;	
}
.li_nav li{
	float:left;
	padding:0 5px;
}
.li_nav li::before{
	content:"｜";	
}
.li_nav li a:hover{
	border-bottom:solid 2px #666;	
}

/* ボタン */
.bt_gray a{
	border:solid 1px #ccc;
	padding:3px 5px;
	margin:5px 0;
	font-size:0.875em;
	background-color:#e6e6e6;
}
.bt_gray a:hover{
	background-color:#ccc;
}

/* テーブル */
.tb_01{
	border-collapse:collapse;	
}
.tb_01 th{
	padding:10px 20px;
	border-bottom:dotted 1px #333;
}
.tb_01 td{
	padding:10px 20px;
	border-bottom:dotted 1px #333;	
}

.tb_02{
	border-collapse:collapse;	
}
.tb_02 td{
	padding:0.3em 1em;
	border-bottom:solid 1px #ccc;	
}

/* 枠 */
.waku_pink{
	border:solid 1px #FF9797;
	padding:0.5em;	
}

/* レスポンシブカラム */
.box{
    margin:0 auto;    
}
.box section {
    float:left;
    margin:10px;
    padding:10px;
    border:solid 1px #ccc;
    width:calc((100% - 40px - 40px - 4px) / 2 ) ;
}
.box section h4{
	margin:0 0 0.5em 0;	
}
    
@media screen and (max-width:767px) {
    .box{
    margin:0 auto;  
}        
    .box section {
    margin:3px;
    width:90%;   
}

}




/* ==== タブレット以上用 ==== */
@media screen and (min-width:768px){
/* 幅 */
.w_max75{
	max-width:75%;
}
.w_max55{
	max-width:55%;	
}
.w_max40{
	max-width:40%;
}
.w_max30{
	max-width:30%;
}
.w_420{
	width:420px;	
}


	

}

