@charset "UTF-8";

/* ++++++++++++++　　　トップページ　　　++++++++++++++++++*/




/* ////////////////////////////////////////////////////////////////////////////////////////

　　　　　全てのスクリーンサイズで適用される設定・モバイルファースト
　　　　　
//////////////////////////////////////////////////////////////////////////////////////// */

/*******************************************************　　　　　　　　
　　　　　　ヘッダー　ナビゲーション部分　　
*******************************************************/


/*　キャッチヘッダーテキスト　hide*/
h1#head-text1{
	font-size:1px;
	line-height:1px;
	color:#fff;
}






/*******************************************************　　　　　　　　
　　　　　　　キャッチ　　
*******************************************************/
div#cach-AREA{
	overflow:hidden;
	width:100%;
	position:relative;
	clear:both;
}




div#cach{
	max-width:480px;
	margin-left:auto;
	margin-right:auto;
	border-top:solid 1px #ccc;
	border-bottom:solid 1px #ccc;
	
	position:relative;
	width:100%;
	height:auto;
	background:url(../images2/b000_00cach_s.jpg) no-repeat;
	background-size:contain;
}



/* before指定 */
/* 横：高さの比率を paddingで指定*/
div#cach:before{
	content:"";
	display:block;
	padding-top:42.083%;
	
}




/******KAATSU JAPANバナー*******/

p#kj1-btn{
	position:absolute;
	top:5px;
	right:5px;
}


p#kj1-btn a{
	display:block;
	width:133px;
	height:39px;
	background:url(../images2/b000_01KJbtn_s.png) no-repeat;
}







/******コラムバナー*******/
p#clm-btn{
	position:absolute;
	top:5px;
	right:5px;
}


p#clm-btn a{
	display:block;
	width:133px;
	height:75px;
	background:url(../images2/b000_02clmbtn_s.png) no-repeat;
}



/******キャンペーンバナー*******/
p#cam-btn1{
	position:absolute;
	top:10px;
	right:5px;
}


p#cam-btn1 a{
	display:block;
	width:133px;
	height:75px;
	background:url(../images2/b000_02cam_201802btn_s.png) no-repeat;
}







p#kj1-btn a:hover,
p#clm-btn a:hover{
	opacity: .70; /* Standard: FF gt 1.5, Opera, Safari */
    filter: alpha(opacity=70); /* IE lt 8 */
    -ms-filter: "alpha(opacity=70)"; /* IE 8 */
    -khtml-opacity: .70; /* Safari 1.x */
    -moz-opacity: .70; /* FF lt 1.5, Netscape */
}







/*******************************************************　　　　　　　　
　　　　　　　メインコンテンツ部分　　
*******************************************************/

/*------#トレーニングコンテンツブロック------*/
section#bs-waku1{
	background:url(../images2/b000_100_back_20220529.jpg) no-repeat;
	/*background-size:contain;*/
    background-size:cover;
}

h3#con-st1{
	max-width:480px;
	margin-left:auto;
	margin-right:auto;
	position:relative;
	width:100%;
	height:auto;
	background:url(../images2/b000_10_s2.png) no-repeat;
	background-size:contain;
}



/* before指定 */
/* 横：高さの比率を paddingで指定 */
h3#con-st1:before{
	content:"";
	display:block;
	padding-top:11.0416%;
	
}


/*　マウスオーバー時、バックに10%透過の白背景表示　*/
h3#con-st1 a:hover,
h3#con-st1-2 a:hover{
	background-color:rgba( 255, 255, 255, 0.2 );
}


h3#con-st1-2{
	display:none;
}







ul#bs-trng01,
ul#bs-trng02{	
	width:100%;
	max-width:419px;
	margin-left:7%;
}

ul#bs-trng01{
	margin-top:10px;
	margin-bottom:10px;
}

ul#bs-trng02{
	padding-bottom:10px;
}




ul#bs-trng01 li{
	float:left;
}

/*　////　ボーソレイユのトレーニング　各コンテンツリンク指定　//// 　*/


li#bs-tr01{
	max-width:130px;
	position:relative;
	width:27.083%;
	height:auto;
	background:url(../images2/b000_11_s.png) no-repeat;
	background-size:contain;/
}

/* before指定 */
/* 横：高さの比率を paddingで指定 */
li#bs-tr01:before{
	content:"";
	display:block;
	padding-top:100%;
}



li#bs-tr02{
	max-width:130px;
	position:relative;
	width:27.083%;
	height:auto;
	background:url(../images2/b000_12_s_20210814.png) no-repeat;
	background-size:contain;	
}

/* before指定 */
/* 横：高さの比率を paddingで指定 */
li#bs-tr02:before{
	content:"";
	display:block;
	padding-top:100%;
}




li#bs-tr03{
	max-width:130px;
	position:relative;
	width:27.083%;
	height:auto;
	background:url(../images2/b000_13_s.png) no-repeat;
	background-size:contain;	
}

/* before指定 */
/* 横：高さの比率を paddingで指定 */
li#bs-tr03:before{
	content:"";
	display:block;
	padding-top:100%;
}


/* マージン指定 */
li#bs-tr01,
li#bs-tr02{ margin-right:2.708%;}




li#bs-tr04{
	display:none;
}





li#bs-tr05{
	max-width:419px;
	position:relative;
	width:87.2916%;
	height:auto;
	background:url(../images2/b000_15_20161020_s.png) no-repeat;
	background-size:contain;	
}

/* before指定 */
/* 横：高さの比率を paddingで指定 */
li#bs-tr05:before{
	content:"";
	display:block;
	padding-top:15.7517%;
}



/*　マウスオーバー時、バックに10%透過の白背景表示　*/
li#bs-tr01 a:hover,
li#bs-tr02 a:hover,
li#bs-tr03 a:hover,
li#bs-tr05 a:hover{
	background-color:rgba( 255, 255, 255, 0.2 );
}





















/*------#ボーソレイユ紹介ブロック------*/

section#bs-waku2{
}

section#bs-waku2 h3{
	float:left;
}



h3#con-st21{
	max-width:159px;
	margin-left:auto;
	margin-right:auto;
	position:relative;
	width:33.125%;/
	height:auto;
	background:url(../images2/b000_21_s.jpg) no-repeat;
	background-size:contain;
}

/* before指定 */
/* 横：高さの比率を paddingで指定*/
h3#con-st21:before{
	content:"";
	display:block;
	padding-top:100%;
	
}


h3#con-st22{
	max-width:159px;
	margin-left:auto;
	margin-right:auto;
	position:relative;
	width:33.125%;
	height:auto;
	background:url(../images2/b000_22_20180201_s.jpg) no-repeat;
	background-size:contain;
}

/* before指定 */
/* 横：高さの比率を paddingで指定 */
h3#con-st22:before{
	content:"";
	display:block;
	padding-top:100%;
	
}




h3#con-st23{
	max-width:162px;
	margin-left:auto;
	margin-right:auto;
	position:relative;
	width:33.75%;
	height:auto;
	background:url(../images2/b000_23_2023_s.jpg) no-repeat;
	background-size:contain;
}

/* before指定 */
/* 横：高さの比率を paddingで指定 */
h3#con-st23:before{
	content:"";
	display:block;
	padding-top:100%;
	
}






/*　マウスオーバー時、バックに10%透過の白背景表示　*/
h3#con-st21 a:hover,
h3#con-st22 a:hover,
h3#con-st23 a:hover{
	background-color:rgba( 255, 255, 255, 0.2 );
}

















/*------#コラムブロック------*/
section#clm{
	clear:both;
}

section#clm h3{
}

section#clm h3{
	max-width:480px;
	margin-left:auto;
	margin-right:auto;
	border-bottom:dotted 1px #ccc;
	position:relative;
	width:100%;
	height:auto;
	background:url(../images2/b000_30_s.png) no-repeat;
	background-size:contain;	
}



/* before指定 */
/* 横：高さの比率を paddingで指定*/
section#clm h3:before{
	content:"";
	display:block;
	padding-top:14.375%;
	
}










/*------#ニュースブロック------*/


#newsWrap{
	width:90%;
	margin:0 auto 0 auto;
}



section#news{
	max-width:684px;
	width:100%;
	border-top: solid 1px #a8997f;
	border-bottom: solid 1px #a8997f;
	margin-left:auto;
	margin-right:auto;
}


section#news h3{
	font-size:18px;font-size:1.8rem;
	line-height:18px;line-height:1.8rem;
	color:#a8997f;
	padding:10px 0 7px 7px;
}


table.news-table{
	width:100%;
	max-width:684px;
}

table.news-table tr{
	border-top: dotted 1px #a8997f;
}

table.news-table tr:first-child{
	border-top: solid 1px #a8997f;
}


table.news-table th,
table.news-table td{
	font-weight:normal;
	font-size:14px;font-size:1.4rem;
	line-height:18px;line-height:1.8rem;
}

table.news-table th{
	width:100px;
	padding:7px 0 7px 15px;
	text-align:left;
	color:#666;
}

table.news-table td{
	padding:7px 0 7px 0;
}







/* ////////////////////////////////////////////////////////////////////////////////////////

　　　　　スクリーンサイズ 幅 480px 以上で適用される設定・上から継承したスタイルを上書き
　　　　　
//////////////////////////////////////////////////////////////////////////////////////// */

@media only screen and (min-width: 480px) {
	

/*******************************************************　　　　　　　　
　　　　　　　キャッチ　　
*******************************************************/
div#cach-AREA{
	width:100%;
	position:relative;
	clear:both;
}




div#cach{
	max-width:767px;/* 　適宜　max-width指定 */
	margin-left:auto;/* 　適宜　マージン指定 */
	margin-right:auto;
	border-top:solid 1px #ccc;
	border-bottom:solid 1px #ccc;
	
	position:relative;/*　中に入れ子にするinner要素の指定のためpositionを指定　*/
	width:100%;/*　横幅の可変を可能にするため、％指定する　*/
	height:auto;/*　auto指定　実際の高さは、:beforeのpadding-topで指定する　*/
	background:url(../images2/b000_00cach_s2.jpg) no-repeat;/*　バックグラウンドに指定する画像を配置　*/
	background-size:contain;/*　バックグラウンドに指定する画像を、縦横比を変えないで、伸縮させる　*/	
}



/* before指定 */
/* 横：高さの比率を paddingで指定し、高さを指定する */
/*　　例　幅1000px　高さ665pxの画像を入れる場合　　*/
div#cach:before{
	content:"";
	display:block;
	padding-top:28.6831%;
	
}




/*******************************************************　　　　　　　　
　　　　　　　メインエリア　　
*******************************************************/
div#main-Area{
	margin-top:10px;
	
}



/*******************************************************　　　　　　　　
　　　　　　　メインコンテンツ部分　　
*******************************************************/


/*----#トレーニングコンテンツブロック-----*/
section#bs-waku1{
	position:relative;
	max-width:684px;
	margin-left:auto;
	margin-right:auto;
	margin-bottom:15px;
	background:none;	
}


/*　 タイトル　*/
h3#con-st1{
	display:none;
}



h3#con-st1-2{
	display:block;
	max-width:684px;
	margin-left:auto;
	margin-right:auto;
	position:relative;
	width:100%;
	height:auto;
	background:url(../images2/b000_10.png) no-repeat;
	background-size:contain;
}



/* before指定 */
/* 横：高さの比率を paddingで指定 */
h3#con-st1-2:before{
	content:"";
	display:block;
	padding-top:5.8479%;
}










div#bs-trng{
	display:block;
}



ul#bs-trng01,
ul#bs-trng02{	
	width:100%;
	max-width:684px;
	margin-left:0;
}

ul#bs-trng01{
	margin-top:0;
	margin-bottom:6px;
}

ul#bs-trng02{
	padding-bottom:0;
}



ul#bs-trng01 li,
ul#bs-trng02 li{
	float:left;
}

/*　////　ボーソレイユのトレーニング　各コンテンツリンク指定　//// 　*/

/********　  小サイズ　（３分割タイプ）  ********/
li#bs-tr01{
	max-width:223px;
	position:relative;
	width:32.602%;
	height:auto;
	background:url(../images2/b000_11_2_20220529.png) no-repeat;
	background-size:contain;/
}

/* before指定 */
/* 横：高さの比率を paddingで指定 */
li#bs-tr01:before{
	content:"";
	display:block;
	padding-top:64.5739%;
}



li#bs-tr02{
	max-width:223px;
	position:relative;
	width:32.602%;
	height:auto;
	background:url(../images2/b000_12_20220529.png) no-repeat;
	background-size:contain;	
}

/* before指定 */
/* 横：高さの比率を paddingで指定 */
li#bs-tr02:before{
	content:"";
	display:block;
	padding-top:64.5739%;
}




li#bs-tr03{
	max-width:223px;
	position:relative;
	width:32.602%;
	height:auto;
	background:url(../images2/b000_13_20220529.png) no-repeat;
	background-size:contain;	
}

/* before指定 */
/* 横：高さの比率を paddingで指定 */
li#bs-tr03:before{
	content:"";
	display:block;
	padding-top:64.5739%;
}


/* マージン指定 */
li#bs-tr01{ margin-right:1.169%;}
li#bs-tr02{ margin-right:1.0233%;}



/************　  中サイズ　（２分割タイプ）  ************/
li#bs-tr04{
	display:block;/* 480以下では非表示だったので、表示指定*/
}

li#bs-tr04{
	max-width:338px;
	position:relative;
	width:49.4152%;
	height:auto;
	background:url(../images2/b000_14.png) no-repeat;
	background-size:contain;	
}

/* before指定 */
/* 横：高さの比率を paddingで指定 */
li#bs-tr04:before{
	content:"";
	display:block;
	padding-top:42.6035%;
}



li#bs-tr05{
	max-width:338px;
	position:relative;
	width:49.4152%;
	height:auto;
	background:url(../images2/b000_15_20161020.png) no-repeat;
	background-size:contain;	
}

/* before指定 */
/* 横：高さの比率を paddingで指定 */
li#bs-tr05:before{
	content:"";
	display:block;
	padding-top:42.6035%;
}

/* マージン指定 */
li#bs-tr04{ margin-right:1.169%;}


/*　マウスオーバー時、バックに10%透過の白背景表示　*/
li#bs-tr01 a:hover,
li#bs-tr02 a:hover,
li#bs-tr03 a:hover,
li#bs-tr04 a:hover,
li#bs-tr05 a:hover{
	background-color:rgba( 255, 255, 255, 0.2 );
}





/*------#ボーソレイユ紹介ブロック------*/
section#bs-waku2{
	width:100%;
	max-width:684px;
	margin-left:auto;
	margin-right:auto;
	margin-bottom:15px;
}



h3#con-st21{
	max-width:223px;
	margin-left:auto;
	margin-right:auto;
	position:relative;
	width:32.602%;
	height:auto;
	background:url(../images2/b000_21.png) no-repeat;
	background-size:contain;
}

/* before指定 */
/* 横：高さの比率を paddingで指定*/
h3#con-st21:before{
	content:"";
	display:block;
	padding-top:72.1975%;
	
}


h3#con-st22{
	max-width:223px;
	margin-left:auto;
	margin-right:auto;
	position:relative;
	width:32.602%;
	height:auto;
	background:url(../images2/b000_22_20180201.png) no-repeat;
	background-size:contain;
}

/* before指定 */
/* 横：高さの比率を paddingで指定 */
h3#con-st22:before{
	content:"";
	display:block;
	padding-top:72.1975%;
	
}



h3#con-st23{
	max-width:223px;
	margin-left:auto;
	margin-right:auto;
	position:relative;
	width:32.602%;
	height:auto;
	background:url(../images2/b000_23_2_2023.png) no-repeat;
	background-size:contain;
}

/* before指定 */
/* 横：高さの比率を paddingで指定 */
h3#con-st23:before{
	content:"";
	display:block;
	padding-top:72.1975%;
	
}


/* マージン指定 */
h3#con-st21{ margin-right:1.169%;}
h3#con-st22{ margin-right:1.0233%;}










/*------#コラムブロック------*/
section#clm{
	max-width:684px;
	margin-left:auto;
	margin-right:auto;
	margin-bottom:15px;
}




section#clm h3{
	max-width:684px;
	margin-left:auto;
	margin-right:auto;
	border-bottom:none;
	position:relative;
	width:100%;
	height:auto;
	background:url(../images2/b000_30.png) no-repeat;
	background-size:contain;	
}



/* before指定 */
/* 横：高さの比率を paddingで指定*/
section#clm h3:before{
	content:"";
	display:block;
	padding-top:7.8947%;
	
}



div#clm-block{
	border-left:solid 1px #a8997f;
	border-right:solid 1px #a8997f;
	border-bottom:solid 1px #a8997f;
	

}


































	
}













/* ////////////////////////////////////////////////////////////////////////////////////////

　　　　　スクリーンサイズ 幅 768px 以上で適用される設定・上から継承したスタイルを上書き
　　　　　
//////////////////////////////////////////////////////////////////////////////////////// */

@media only screen and (min-width: 768px) {
	
/*******************************************************　　　　　　　　
　　　　　　ヘッダー　ナビゲーション部分　　
*******************************************************/
	
h1#head-text1{
	display: block;
	font-size:10px;font-size:1.0rem;
	font-weight:normal;
	line-height:10px;line-height:1.0rem;
	height:18px;
	margin:8px 0 0 6px;
	color:#766c63;
}


	

/*******************************************************　　　　　　　　
　　　　　　　キャッチ　　
*******************************************************/
div#cach-AREA{
	width:100%;
	position:relative;
	clear:both;
}




div#cach{
	max-width:960px;/* 　適宜　max-width指定 */
	margin-left:auto;/* 　適宜　マージン指定 */
	margin-right:auto;
	border:none;
	position:relative;/*　中に入れ子にするinner要素の指定のためpositionを指定　*/
	width:100%;/*　横幅の可変を可能にするため、％指定する　*/
	height:auto;/*　auto指定　実際の高さは、:beforeのpadding-topで指定する　*/
	background:url(../images2/b000_00cach20180201.png) no-repeat 10px 0;/*　バックグラウンドに指定する画像を配置　*/
	background-size:contain;/*　バックグラウンドに指定する画像を、縦横比を変えないで、伸縮させる　*/	
}



/* before指定 */
/* 横：高さの比率を paddingで指定し、高さを指定する */
/*　　例　幅1000px　高さ665pxの画像を入れる場合　　*/
div#cach:before{
	content:"";
	display:block;
	padding-top:27.6041%;　*/
	
}




/******KAATSU JAPANバナー*******/

p#kj1-btn{
	position:absolute;
	top:5px;
	right:5px;
}


p#kj1-btn a{
	display:block;
	width:162px;
	height:46px;
	background:url(../images2/b000_01KJbtn.png) no-repeat;
}



/******コラムバナー*******/
p#clm-btn{
	position:absolute;
	top:10px;
	right:5px;
}


p#clm-btn a{
	display:block;
	width:162px;
	height:106px;
	background:url(../images2/b000_02clmbtn.png) no-repeat;
}





/******キャンペーンバナー*******/
p#cam-btn1{
	position:absolute;
	top:20px;
	right:5px;
}


p#cam-btn1 a{
	display:block;
	width:162px;
	height:106px;
	background:url(../images2/b000_02cam_201802btn.png) no-repeat;
}













	
}







/* ////////////////////////////////////////////////////////////////////////////////////////

　　　　　スクリーンサイズ 幅 960px 以上で適用される設定・上から継承したスタイルを上書き
　　　　　
//////////////////////////////////////////////////////////////////////////////////////// */

@media only screen and (min-width: 960px) {


/*******************************************************　　　　　　　　
　　　　　　　キャッチ　　
*******************************************************/
div#cach-AREA{
	width:960px;
	position:relative;
	clear:both;
	margin-left:auto;
	margin-right:auto;
}


/*　バックグラウンドの位置　*/	
div#cach{
	background:url(../images2/b000_00cach20180201.png) no-repeat 0 0;/*　バックグラウンドに指定する画像を配置　*/
}



#newsWrap{
	width:100%;
}







}