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


/*------------------------------jQueryの併用で起こったチラツキの防止*/
/*スライドショーのためのbxSliderとグローバルメニューのためのPrMenuの併用*/
/**{-webkit-transform-style: preserve-3d;
}*/


/*ページ全体を囲うボックス*/
#wrapper{
	width:1024px;
	margin:0 auto;
}





/*----------
--------------------------------------------------------------パソコン用コンテンツを表示*/
.pc{
	display:block;
}


/*--------------------
--------------------------------------------------------------スマホ用コンテンツを非表示*/
.sp{
	display:none;
}


/*--------------------2017/8/9

フォント関係*/
.page_name{
	font-size: 25px;
	border-bottom: 1px solid #0095d9;
	margin: 30px 0 20px 0;
	padding: 10px 0 10px 50px;
	font-family: Arial, Helvetica, sans-serif;
	color: #0095d9;
	background-image: url(../trimoff_ss_img/icon_common.svg);
	background-repeat: no-repeat;
	background-position: left center;
	background-size:4%;
}

.top_page_name{
	font-size: 25px;
	font-weight:bold;
	border-top: 2px solid #4fc0e8;
	border-bottom: 2px solid #4fc0e8;
	margin: 0 0 15px 0;
	padding: 10px 0 10px 0;
	text-align:center;
	font-family: Arial, Helvetica, sans-serif;
	color: #4fc0e8;
}

/*---------------------------------トップページ小見出し*/
.top_komidashi_taiken{
	font-size:20px;
	color:#00AA00;
	font-weight:bold;
	border-top: 2px solid #00AA00;
	border-bottom: 2px solid #00AA00;
	padding:5px 0 5px 0;
}



.top_komidashi_stepup{
	font-size:20px;
	color:#036EB8;
	font-weight:bold;
	border-top: 2px solid #036EB8;
	border-bottom: 2px solid #036EB8;
	padding:5px 0 5px 0;
}



.top_komidashi_coaching{
	font-size:20px;
	color:#ff8c00;
	font-weight:bold;
	border-top: 2px solid #ff8c00;
	border-bottom: 2px solid #ff8c00;
	padding:5px 0 5px 0;
}


.top_komidashi_reserved{
	font-size:20px;
	color:#8FC31F;
	font-weight:bold;
	border-top: 2px solid #8FC31F;
	border-bottom: 2px solid #8FC31F;
	padding:5px 0 5px 0;
}


/*------------------------------------------------------------------------------パソコン用トップページ関係の設定*/

/*スライドショー下のコロナウイルスに関する注意書き2020年12月15日追記*/
.top_COVID_box{
	width:100%;
	height:auto;
	padding:2%;
	box-sizing: border-box;
	/*background-color: #FF0000;*/
	border:2px solid #4fc0e8;
	border-radius: 10px;
	margin:0 0 15px 0;
	color:#000000;
	overflow: auto;
}

.COVID_Midashi{
	background-color: #4fc0e8;
	display: block;
	width:100%;
	border-radius: 10px;
	padding:2%;
	font-size: 18px;
	line-height: 22px;
	box-sizing: border-box;
}


.top_COVID_box_text{
	text-indent: -1.5em;
	margin:0 0 0 1em;
	padding:0 0 0 1em;
}

.top_left_box{
	width:490px;
	height:auto;
	/*border:1px solid #06F;*/
	float:left;
	box-sizing:border-box;
}


.top_inner_left_box{
	width:232px;
	height:auto;
	float:left;
	margin:10px 0 0 0;
}



.top_right_box{
	width:490px;
	height:auto;
	/*border:1px solid #06F;*/
	float:right;
	box-sizing:border-box;
}


.top_inner_right_box{
	width:232px;
	height:auto;
	float:right;
	margin:10px 0 0 0;
}


.top_1set{
	width:100%;
	/*border:1px solid #F3C;*/
	box-sizing:border-box;
	margin:0 0 20px 0;
	float:left;
}



/*---------------------
-------------------------social関係（サイドバーのTwitter、facebook、インスタグラムのロゴマーク）*/
.sns_box{
	width:180px;
	height:auto;
	margin:0 0 15px 0;
	/*border:1px solid #000000;*/
	float:left;
}

.sns{
	width:50px;
	height:50px;
	/*border:1px solid #000000;*/
	float:left;
	margin:0 11px 0 0;
}

.sns:last-child{
	width:50px;
	height:50px;
	/*border:1px solid #000000;*/
	float:left;
	margin:0 0 0 0;
}



.sns_box_top{
	width:auto;
	height:auto;
	/*border:1px solid #FFFFFF;*/
	text-align:right;
	float:right;
	margin:0 0 0 0;
}


.sns_box_watanabe{
	width:25%;
	height:auto;
	margin:5px 0 0 0;
	padding:0 0 0 0;
	float:right;
	/*overflow:auto;*/
	text-align:right;
}

.float_L{
	float:left;
	width:100%;
}

.card{
	text-align:right;
	float:right;
	width:100%;
}





/*-----------
--------------------------------------------------------------パソコン用ヘッダー全体を囲うボックス*/
#header_box{
	width:1024px;
	height:150px;
	/*border:1px solid #080;*/
	position:relative;
	background:#FFFFFF;
	z-index: 1;
}

/*----------
--------------------------------------------------------------パソコン用ヘッダー内のロゴを囲うボックス*/
#logo_box{
	/*position:absolute;*/
	display:block;
	float:left;
	margin:35px 0 0 0;
	width:353px;
	height:42px;
	/*top:35px;
	left:10px;*/
	/*border:1px solid #080;*/
}


/*--------------------
--------------------------------------------------------------パソコン用ヘッダー内の社名、住所、電話番号などテキストの入ったボックス*/
.info_box{
	width:260px;
	height:75px;
	position:absolute;
	right:0px;
	top:50px;
	/*border:1px solid #FF0000;*/
	font-size:12px;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro","メイリオ", Meiryo, Osaka;
	line-height:20px;
}

.info_box a{
	text-decoration:none;
	color:#000000;
}

.info_box a:hover{
	text-decoration:underline;
	color:#0000EE;
}

.mail{
	text-align:right;
	margin:0 0 0 0;
	padding:0 15px 0 0;
}

/*------------------------------
--------------------------------------------------------------パソコン用ヘッダー内の社名ボックステキストのフォントサイズ設定*/
.syamei{
	font-size:13px;
	font-weight:bold;
}

.tel {
	font-size: 2em;	/*文字サイズ*/
	font-weight:bold;
	letter-spacing: 0.03em;
}
	
.tel img{
	width: 25px;	/*文字サイズ*/
	height:auto;
	margin:0 3px -3px 0;
}

.tel a{
	text-decoration: none;	
	}
	
.tel a:hover{
	text-decoration: none;	
	color:#555555;
	}	


/*----------------------------
--------------------------------------------------------------パソコン用トップページ用のコンテンツの設定*/
#contents{
	width:100%;
	padding:0% 0% 0% 0%;
	/*background:#f0f8ff;*/
	float:left;
	font-size:13px;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro","メイリオ", Meiryo, Osaka;
	/*border:1px solid #FF0000;*/
}


/*--------------------------
--------------------------------------------------------------パソコン用汎用ページ用のコンテンツの設定*/
#contents_hanyou{
	width:820px;
	margin:0 0 0 0;
	padding:0 0% 5% 0%;
	float:left;
	font-size:13px;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro","メイリオ", Meiryo, Osaka;
	/*border:1px solid #000000;*/

}


/*------------------------------
--------------------------------------------------------------パソコン用汎用コンテンツボックスの見出し設定*/
#contents_hanyou h2{
	font-size:24px;
	font-family:Georgia, "Times New Roman", Times, serif;
}



/*------------------------------
--------------------------------------------------------------小分類のグローバルナビゲーション*/
#small_navi{
	float:left;
	height:auto;
	width:820px;
	margin:0 0 15px 0;
	padding:0;
}

#menu li a{
	display:block;
	width:163px;
	padding:15px 0 15px 0;
	border-right:1px solid #FFFFFF;
	background-color:#5b7e91;
	font-size:12px;
	color:#FFFFFF;
	text-align:center;
	float:left;
	text-decoration:none;
	
}

#menu li a:hover{
	background-color:#192f60;
	color:#FFFFFF;
}




/*---------------------
--------------------------------------------------------------コンテンツ内容の部分の設定
-----------------------
--------------------------------------------------------------テンプレートの編集可能領域*/


/*---------------------
--------------------------------------------------------------パソコン用　写真とテキストが3：7のページ設定　2017/8/10*/

.wave_line{
	width:820px;
	height:auto;
	float:left;
	clear:both;
}


/*---------------------
--------------------------------------------------------------写真の入っているボックス*/

.three{
	width:285px;
	height:auto;
	/*border:1px solid #000000;*/
	margin:15px 0 15px 0;
	float:left;
	display:table-cell;
}


.three img{
	/*border:1px solid #000000;*/
}

/*----------------------
--------------------------------------------------------------右側のテキストの入っているボックス*/
.seven{
	width:505px;
	/*border:1px solid #FF0000;*/
	margin:15px 0 15px 0;
	float:right;
}


.seven img{
	margin:15px 0 10px 0;
}


.date{
	border:1px solid #000000;
	font-size:14px;
	padding:5px;
	margin:0 0 10px 0;
	background-color:#f5f5f5;
}


.name_m{
	font-size:20px;
	color:#0066FF;
	margin:0 0 10px 0;
}


.name_w{
	font-size:20px;
	color:#FF99FF;
	margin:0 0 10px 0;
}


.comment{
	margin:10px 0 0 0;
	font-size:15px;
	line-height:25px;
}

.comment p{
	margin:5px 0 0 0;
	font-size:13px;
	line-height:22px;
}


/*---------------------
--------------------------------------------------------------コンテストコーチング、サーフィン検定合格コーチング*/

.coaching_main img{
	width:100%;
	height:auto;
}

.step{
	font-size:20px;
	color:#0066FF;
	margin:0 0 0 0;
	text-align:center;
	font-weight:bold;
}


.step_2{
	font-size:20px;
	color:#0066FF;
	vertical-align:middle;
	text-align:center;
}



.step_2gyou{
	font-size:20px;
	color:#0066FF;
	margin:15px 0 0 0;
	text-align:center;
}

.step_3gyou{
	font-size:20px;
	color:#0066FF;
	margin:25px 0 0 0;
	text-align:center;
}


/*--------------------
--------------------------------------------------------------レッスン料金のページに関する設定*/


h3{
	font-size:15px;
	font-weight:bold;
	margin:10px 0 0 0;
	text-align:center;
}


h4{
	font-size:24px;
	font-weight:bold;
	border-top:1px solid #000000;
	border-bottom:1px solid #000000;
	padding:5px 0 5px 0;
	text-align:center;
	line-height:30px;
}


h5{
	font-size:30px;
	font-weight:bold;
	text-align:right;
}

h6{
	font-size:20px;
	font-weight:bold;
	color:#751485;
	width:100%;
	border-top:1px solid #000000;
	border-bottom:1px solid #000000;
	margin:0 0 15px 0;
	padding:5px 0 5px 0;
	text-align:center;
	float:left;
}

h7{
	font-weight:bold;
}

/*---------------------------------------------------その他のサービスページのフォント設定*/

h4.other_4{
	font-size:22px;
	font-weight:bold;
	color:#53858A;
	border-top:1px solid #000000;
	border-bottom:1px solid #000000;
	padding:5px 0 5px 0;
	text-align:center;
	line-height:30px;
}


h5.other_5{
	font-size:24px;
	font-weight:bold;
	text-align:right;
	margin:15px 0 0 0;
}




/*---------------------------------------------------その他のサービスページのボタン設定*/
button.other_Btn{
	width:100%;
	margin:10px 0 0 0;
	padding:10px 0 10px 0;
	border-radius:10px;
	border:none;
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0.00, #fff), color-stop(1.00, #838383));
	background: -webkit-linear-gradient(#fff, #838383);
	background: -moz-linear-gradient(#fff, #838383);
	background: -o-linear-gradient(#fff, #838383);
	background: -ms-linear-gradient(#fff, #838383);
	background: linear-gradient(#fff, #838383);
	font-size:16px;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;

}

button.other_Btn:hover{
	background: -webkit-gradient(linear, left top, left bottom, color-stop(1.00, #605D5C), color-stop(0.00, #FAFAFA));
	background: -webkit-linear-gradient(#FAFAFA, #605D5C);
	background: -moz-linear-gradient(#FAFAFA, #605D5C);
	background: -o-linear-gradient(#FAFAFA, #605D5C);
	background: -ms-linear-gradient(#FAFAFA, #605D5C);
	background: linear-gradient(#FAFAFA, #605D5C);

}


/*--------------
--------------------------------------------------------------ステップアップスクールは入会金10,000円〈※初回限り〉をお申し受け致します。の文言の設定*/
.stepup_1{
	width:820px;
	font-size:15px;
	margin:20px 0 15px 0;
	text-align:center;
	line-height:30px;
	float:left;
}


/*-----------------------------------------------------------キャンペーンバナー/入会金0円/ステップアップ価格ページ*/
.Photo_Box{
	padding:0 0 0 0;
	margin:10px 0 0 0;
	text-align:left;
	/*border:1px solid #000000;*/
	float:left;
	width:100%;
}

.Photo_Box img{
	margin:5px 0 0 0;
	/*border:1px solid #000000;*/
}




/*--------------
--------------------------------------------------------------パソコン用予約の文字*/
.yoyaku_text{
	font-size:17px;
	margin:20px 0 0 0;
	float:left;
	font-weight:bold;
}


.yoyaku_text a{
	padding: 0.5em;
	transition: all .3s;
	color:#5b7e91;
	text-decoration:none;
}


.yoyaku_text a:hover{
	color:#FFFFFF;
	background-color:#87cefa;
	
}



/*------------------
--------------------------------------------------------------パソコン用　写真とテキストが2：8のページ設定　レンタルページのみ*/
.two{
	width:9%;
	/*border:1px solid #ff0000;*/
	float:left;
	margin:15px 0 15px 0;
}


.four_1{
	width:44.5%;
	/*border:1px solid #000000;*/
	float:left;
	margin:15px 0 15px 10px;
}


.four_2{
	width:44.5%;
	/*border:1px solid #000000;*/
	float:right;
	margin:15px 0 15px 0;
}

.four_2 img{
	width:100%;
	height:auto;
}




.eight{
	width:89%;
	/*border:1px solid #000000;*/
	float:right;
	margin:15px 0 15px 0;
}


.f_effect_12{
	display:block;
	font-size:12px;
	line-height:20px;
	/*border-bottom:1px solid #000000;*/
	padding:0 0 10px 0;
	width:100%;
}


.f_effect_15{
	font-size:15px;
	line-height:30px;
}

.f_effect_18{
	font-size:18px;
	line-height:36px;
}


.f_effect_24{
	font-size:20px;
}

.f_effect_30{
	font-size:25px;
	font-weight:bold;
	line-height:40px;
}

.f_effect_l_T{
	text-decoration: line-through;
	text-decoration-color:#FF0000;
}


/*-----------------------------------------------------------行間（程よいアキの行間/汎用）*/
.l_H{
	line-height:150%;
}


/*-----------------------------------------------------------段落間のアキ（汎用）*/
.Danraku{
	margin:0 0 15px 0;
}

.Danraku_Line{
	margin:0 0 15px 0;
	padding:15px 0 0 0;
	border-top:1px solid #000000;
}




/*-------------------
--------------------------------------------------------------パソコン用　写真とテキストが1：1のページ設定　インストラクターページのみ*/

.left_b{
	float:left;
	width:395px;
	/*border:1px solid #FF0000;*/
}


/*-------------------------------------------------------------left_bの中の左側の箱*/
.left_b_L{
	float:left;
	width:290px;
	/*border:1px solid #FF0000;*/
}


/*-------------------------------------------------------------肩書き、名前、生年月日を囲うボックス
border-bottomのみ設定*/
.name_Box{
	border-bottom:1px solid #000000;
	float:left;
	width:100%;
}





.right_b{
	float:right;
	width:395px;
	/*border:1px solid #CC66FF;*/
	
}

.left_b p{
	font-size:15px;
	line-height:25px;
	margin:20px 0 0 0;
}


.right_b p{
	font-size:15px;
	line-height:25px;
	margin:20px 0 0 0;
}



/*--------------------
--------------------------------------------------------------パソコン用　Q&Aのページ*/
.qa_box{
	width:100%;
	border:2px solid #036EB8;
	float:left;
	margin:0 0 25px 0;
	padding:10px;
	box-sizing:border-box;
	border-radius: 10px;        /* CSS3草案 */  
    -webkit-border-radius: 10px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 10px;   /* Firefox用 */ 
}

.inner_qa_box{
	width:100%;
	/*border:1px solid #000000;*/
	padding:10px;
	box-sizing:border-box;
}

.qa_box img{
	width:70px;
	height:auto;
	
}

.qa_text_1{
	width:680px;
	float:right;
	line-height:90px;
	/*border:1px solid #FF0000;*/
}

.qa_text_2{
	width:680px;
	float:right;
	line-height:25px;
	/*border:1px solid #FF0000;*/
}


/*-----------------------
--------------------------------------------------------------パソコン用　アクセスページ*/

/*-----------------------
--------------------------------------------------------------Google Mapの部分*/
.google-maps{
	width:820px;
	height:500px;
	float:left;
	margin:0 0 15px 0;
	padding:0 0 15px 0;
	/*border:1px solid #0A0;*/
	
}


.access_box{
	width:100%;
	border:2px solid #036EB8;
	float:left;
	margin:15px 0 15px 0;
	padding:15px;
	box-sizing:border-box;
	border-radius: 10px;        /* CSS3草案 */  
    -webkit-border-radius: 10px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 10px;   /* Firefox用 */ 
}


.access_text_1{
	font-size:20px;
	width:680px;
	float:left;
	padding:0 0 0 25px;
}


.access_text_2{
	width:680px;
	float:left;
	line-height:20px;
	margin:15px 0 0 0;
	/*border:1px solid #FF0000;*/
}


.access_bus{
	background-image: url(../trimoff_ss_img/icon_bus.svg);
	background-repeat: no-repeat;
}


.access_train{
	background-image:url(../trimoff_ss_img/icon_train.svg);
	background-repeat: no-repeat;
}


.access_time{
	background-image:url(../trimoff_ss_img/icon_watch.svg);
	background-repeat: no-repeat;
}


.access_address{
	background-image:url(../trimoff_ss_img/icon_address.svg);
	background-repeat: no-repeat;
}




/*-------------
--------------------------------------------------------------ページ右部分サイドメニューボックス*/
#side_menu_box{
	width:180px;
	height:auto;
	float:right;
	box-sizing: border-box;
}



/*------------------------------------
--------------------------------------------------------------ページ右のサイドバー内のスポンサーのバナーが入るボックス*/
#sponsor_box{
	width:180px;
	height:auto;
	float:left;
	margin:0 0 0 0;
}

.sponsor{
	width:180px;
	height:auto;
	margin:15px 0 0 0;
	float:left;
}

.sponsor img{
	width:100%;
	height:auto;
}


/*------------------------------------
--------------------------------------------------------------PC用トップページ下部のスポンサーのバナーが入るボックス*/

#sponsor_box_TopBottom{
	width:100%;
	height:auto;
	float:left;
	margin:0 0 20px 0;
}

.sponsor_TopBottom{
	width:23.5%;
	height:auto;
	margin:15px 2% 0 0;
	/*padding:0 3% 0 0;*/
	float:left;
}

.sponsor_TopBottom_last{
	width:23.5%;
	height:auto;
	margin:15px 0 0 0;
	/*padding:0 3% 0 0;*/
	float:right;
}

.sponsor_TopBottom img{
	width:100%;
	height:auto;
	margin:15px 0 0 0;
	padding:0 0 0 0;
	float:left;
}

.sponsor_TopBottom_last img{
	width:100%;
	height:auto;
	margin:15px 0 0 0;
	float:right;
}





/*-------------
--------------------------------------------------------------パソコン用コンセプトのテキストを囲うボックス*/
#consept_text{
	width:71%;
	/*border:1px solid #000000;*/
	float:right;
	padding:15px 0 15px 0;
}


/*----------
--------------------------------------------------------------パソコン用コンセプトのテキストの設定*/
#consept_text p{
	font-size:17px;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro","メイリオ", Meiryo, Osaka;
	line-height:25px;
}




/*-------------
--------------------------------------------------------------画像へのリンク設定がある場合の、画像への透過設定*/
a img:hover{
	filter:alpha(opacity=70);
	-moz-opacity:.70;
	opacity:.70;
}


/*------------
--------------------------------------------------------------パソコン用メインビジュアル画像設定*/
#main_visual{
	width:1024px;
	height:auto;
	padding:0 0 0 0;
	float:left;
}


/*----------
--------------------------------------------------------------パソコン用グローバルナビゲーション*/


#top-menu{
	float:left;
	margin:0 0 0 0;
	z-index:1;
}



.social_box{
	width:100%;
	/*border:1px solid #33CCCC;*/
	float:left;
	text-align:center;
	padding:5% 0 0 0;
}



/*---------------------
--------------------------------------------------------------PC版フッターを囲うボックス*/
.fbc{
	width:96%;
	padding:3% 2% 3% 2%;
	background:#89c3eb;
	float:left;
	font-size:15px;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro","メイリオ", Meiryo, Osaka;
	/*border:1px solid #000000;*/
	}


/*--------------------
--------------------------------------------------------------フッターメニュー横並び*/
.fbc ul li{
	float:left;
}


.fbc p{
	margin:10px 0 0 0;
}


.fbc a{
	text-decoration:none;
	color:#000000;
}


.fbc a:hover{
	text-decoration:underline;
	color:#0000EE;
}



/*--------------------
--------------------------------------------------------------PC版コピーライト部分*/
#copyright_box{
	width:45%;
	display:block;
	float:left;
	margin:10px 0 0 0;
	font-size:12px;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro","メイリオ", Meiryo, Osaka;
	
}


/*--------------------------------------------
--------------------------------------------------------------パソコン用問い合わせフォーム、予約フォーム関係の設定*/
#formWrap {
	width:700px;
	margin:0 auto;
	color:#555;
	line-height:120%;
	font-size:90%;
}




#formWrap p{
	padding: 15px 0 20px 0;
}


table.formTable{
	width:100%;
	margin:0 auto;
	border-collapse:collapse;
}


table.formTable td,table.formTable th{
	border:1px solid #ccc;
	padding:10px;
}


table.formTable th{
	width:30%;
	font-weight:normal;
	background:#efefef;
	text-align:left;
	vertical-align:middle;
}

/*.scheduleComment{
	background-color:#89c3eb;
	box-sizing:border-box;
	padding:5px;
	width:auto;
}
*/


/*-----------------
--------------------------------------------------------------パソコン用サンクスページの設定*/
.f_effect_thanks{
	font-size:20px;
	line-height:35px;
}


.f_effect_thanks_small{
	margin:20px 0 0 0;
	padding:10px 0 10px 0;
	float:left;
	font-size:15px;
	line-height:25px;
	border-top:1px solid #000000;
	border-bottom:1px solid #000000;
}



/*-----------------
--------------------------------------------------------------色の設定*/
.coLor_Red{
	color:#FF0000;
}


/*-----------------
--------------------------------------------------------------微調整*/
.interVal{
	margin:0 10px 0 10px;
}

.f_s_12{
	font-size:12px;
	padding:3px 0 3px 3px;
	width:100%;
	float:left;
	text-align:left;
	background-color:#f5f5f5;
}


.tokeimoji{
	font-family:"ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;
}








/* ------------------------------------------------ */
/* レスポンシブ（767px以下）
/* ------------------------------------------------ */
@media(max-width:767px) {

#wrapper{
	width:100%;
}


/*----------
--------------------------------------------------------------スマホ用コンテンツを表示*/
.sp{
	display:block;
}


/*--------------------
--------------------------------------------------------------パソコン用コンテンツを非表示*/
.pc{
	display:none;
}


#header_box{
	position:static;
	width:100%;
	height:auto;
	display:block;
	float:left;
	/*background:#FFCCFF;*/
}
	
	
/*スライドショー下のコロナウイルスに関する注意書き 2020年12月15日追記*/
.top_COVID_box{
	width:96%;
	height:auto;
	padding:4%;
	box-sizing: border-box;
	/*background-color: #FF0000;*/
	border:2px solid #4fc0e8;
	border-radius: 10px;
	margin:0 2% 15px 2%;
	color:#000000;
}
	
.top_COVID_box_text{
	text-indent: -1.5em;
	margin:0 0 0 1em;
	padding:0 0 0 1em;
	width:96%;
}	

/*--------------------------------
--------------------------------------------------------------2017/8/9　フォント関係*/
.page_name{
	font-size: 20px;
	border-bottom: 1px solid #0095d9;
	margin: 220px 2% 20px 2%;
	padding: 10px 0 10px 45px;
	font-family: Arial, Helvetica, sans-serif;
	color: #0095d9;
	background-image: url(../trimoff_ss_img/icon_common.svg);
	background-repeat: no-repeat;
	background-position: left center;
	background-size:8%;
}



/*--------------------
--------------------------------------------------------------スマホ版ヘッダー内のロゴ画像のボックス*/
#logo_box{
	position:static;
	width:100%;
	height:auto;
	float:left;
	display:block;
	/*border:1px solid #080;*/
}


/*--------------------
--------------------------------------------------------------スマホ版ヘッダー内のロゴ画像*/
#logo_box img{
	width:70%;
	height:auto;
	margin:5% 0 5% 15%;
	display:block;
	float:left;
}


/*--------------------
--------------------------------------------------------------スマホ版ヘッダー内の社名、住所、電話番号などテキストの入ったボックス*/
.info_box{
	position:static;
	width:100%;
	height:auto;
	margin:5% 0% 2% 0%;
	padding:7% 0 3% 0;
	border-top:1px solid #000000;
	border-bottom:1px solid #000000;
	display:block;
	float:left;
	font-size:12px;
	line-height:15px;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro","メイリオ", Meiryo, Osaka;
}


.mail{
	text-align:right;
	margin:-8% 0 0 0;
	padding:0 15px 0 0;
}



/*--------------------
--------------------------------------------------------------スマホ用メインビジュアルの設定*/
#main_visual{
	width:100%;
	height:auto;
	float:left;
	padding:50px 0 0 0;
}


#main_visual img{
	width:100%;
	height:auto;
	float:left;
}



/*------------------------------------
--------------------------------------------------------------スマホ用グローバルナビゲーション*/
#top-menu{
	float:left;
	margin:0 0 100px 0;
}




/*-----------------------------------
--------------------------------------------------------------スマホ用トップページ関係の設定*/
.top_left_box{
	width:96%;
	margin:0 2% 15px 2%;
	height:auto;
	/*border:1px solid #06F;*/
	float:left;
	box-sizing:border-box;
}


.top_left_box img{
	width:100%;
	height:auto;
}


.top_inner_left_box{
	width:47%;
	height:auto;
	float:left;
	margin:10px 0 0 0;
}


.top_inner_left_box img{
	width:100%;
	height:auto;
}



.top_right_box{
	width:96%;
	margin:0 2% 0 2%;
	height:auto;
	/*border:1px solid #06F;*/
	float:left;
	box-sizing:border-box;
}


.top_right_box img{
	width:100%;
	height:auto;
}


.top_inner_right_box{
	width:47%;
	height:auto;
	float:right;
	margin:10px 0 0 0;
}


.top_inner_right_box img{
	width:100%;
	height:auto;
}


.top_1set{
	width:100%;
	/*border:1px solid #F3C;*/
	box-sizing:border-box;
	margin:0 0 20px 0;
	float:left;
}




/*------------------------------
--------------------------------------------------------------スマホ用　小分類のグローバルナビゲーション*/
#small_navi{
	width:100%;
	
}


#menu li a{
	display:block;
	width:50%;
	padding:15px 0 15px 0;
	border-right:1px solid #FFFFFF;
	border-bottom:1px solid #FFFFFF;
	background-color:#5b7e91;
	font-size:12px;
	color:#FFFFFF;
	text-align:center;
	float:left;
	text-decoration:none;
	box-sizing:border-box;
	
}

#menu li a:hover{
	background-color:#192f60;
	color:#FFFFFF;
}


/*-----------------
--------------------------------------------------------------スマホ用　写真とテキストが3：7のページ設定　2017/8/10*/



/*--------------
--------------------------------------------------------------ステップアップスクールは入会金10,000円〈※初回限り〉をお申し受け致します。の文言の設定*/
.stepup_1{
	width:80%;
	font-size:15px;
	/*margin:20px 2% 15px 2%;*/
	text-align:center;
	line-height:30px;
	display:block;
	/*float:left;*/
}

.card{
	text-align:center;
	width:100%;
}


/*-----------------------------------------------------------キャンペーンバナー/ステップアップ価格ページ*/
.Photo_Box img{
	width:70%;
	height:auto;
}

.wave_line{
	width:96%;
	margin:0 2% 0 2%;
	height:auto;
}

.wave_line img{
	width:100%;
	height:auto;
}



/*------------------
--------------------------------------------------------------写真の入っているボックス*/
.three{
	width:96%;
	/*border:1px solid #000000;*/
	margin:15px 2% 0 2%;
	float:left;
}

.three img{
	width:90%;
	height:auto;
	margin:0 auto 2% auto;
	text-align:center;
	display:block;
}


/*---------------
--------------------------------------------------------------テキストの入っているボックス*/
.seven{
	width:96%;
	/*border:1px solid #FF0000;*/
	margin:15px 2% 15px 2%;
	float:left;
}

.seven img{
	width:100%;
	height:auto;
}


.date{
	width:96%;
	border:1px solid #000000;
	font-size:14px;
	padding:5px;
	margin:0 0 10px 0;
	float:left;
	background-color:#f5f5f5;
	}


.name_m{
	width:100%;
	font-size:20px;
	color:#0066FF;
	margin:0 0 10px 0;
	float:left;
}


.name_w{
	width:100%;
	font-size:20px;
	color:#FF99FF;
	margin:0 0 10px 0;
	float:left;
}


.comment{
	width: 100%;
	font-size: 15px;
	line-height: 25px;
	/*border: 1px solid #000000;
	background-color:#CCCC33;*/
}

/*-------------
--------------------------------------------------------------コンテストコーチング、サーフィン検定合格コーチング*/

.coaching_main img{
	width:96%;
	height:auto;
	margin:0 2% 0 2%;
	float:left;
}


.step{
	font-size:20px;
	color:#FFFFFF;
	background-color:#0066FF;
	margin:0 0 0 0;
	padding:5px 0 5px 0;
	text-align:center;
}

.step_2gyou{
	font-size:20px;
	color:#FFFFFF;
	background-color:#0066FF;
	margin:0 0 0 0;
	padding:5px 0 5px 0;
	text-align:center;
}

.step_3gyou{
	font-size:20px;
	color:#FFFFFF;
	background-color:#0066FF;
	margin:0 0 0 0;
	padding:5px 0 5px 0;
	text-align:center;
}



/*-------------
--------------------------------------------------------------レッスン料金のページに関する設定*/


h3{
	font-size:15px;
	font-weight:bold;
	margin:10px 0 0 0;
	text-align:center;
}


h4{
	font-size:25px;
	font-weight:bold;
	border-top:1px solid #000000;
	border-bottom:1px solid #000000;
	padding:5px 0 5px 0;
	text-align:center;
}


h5{
	font-size:30px;
	font-weight:bold;
	text-align:center;
}



/*---------------
--------------------------------------------------------------パソコン用　写真とテキストが2：8のページ設定　レンタルページのみ*/
.two{
	width:15%;
	/*border:1px solid #ff0000;*/
	float:left;
	margin:15px 0 15px 2%;
}

.two img{
	width:100%;
	height:auto;
}


.four_1{
	width:77%;
	/*border:1px solid #000000;*/
	float:right;
	margin:15px 0 15px 0;
}


.four_2{
	width:77%;
	/*border:1px solid #000000;*/
	float:right;
	margin:15px 0 15px 0;
}

.four_2 img{
	width:100%;
	height:auto;
}




.eight{
	width:77%;
	/*border:1px solid #000000;*/
	float:right;
	margin:15px 2% 15px 0;
}


.f_effect_15{
	font-size:15px;
	line-height:30px;
}


.f_effect_24{
	font-size:20px;
}

.f_effect_30{
	font-size:20px;
	font-weight:bold;
	line-height:40px;
}



/*-------------
--------------------------------------------------------------スマホ用予約の文字*/
.yoyaku_text{
	width:100%;
	text-align:center;
	font-size:17px;
	margin:20px 0 0 0;
	font-weight:bold;
}



/*--------------
--------------------------------------------------------------SP用　写真とテキストが1：1のページ設定　インストラクターページのみ*/

.left_b{
	float:left;
	width:96%;
	/*border:1px solid #FF0000;*/
	margin:0 2% 15px 2%;
}


.left_b img{
	width:100%;
	height:auto;
	
}


.right_b{
	float:left;
	width:96%;
	/*border:1px solid #CC66FF;*/
	margin:0 2% 0 2%;
}


.right_b img{
	width:100%;
	height:auto;
}


.left_b p{
	font-size:15px;
	line-height:25px;
	margin:20px 0 15px 0;
}


.right_b p{
	font-size:15px;
	line-height:25px;
	margin:20px 0 15px 0;
}


/*---------------
--------------------------------------------------------------スマホ用　Q&Aのページ*/
.qa_box{
	width:96%;
	height:auto;
	border:2px solid #036EB8;
	margin:0 2% 15px 2%;
	padding:10px;
	box-sizing:border-box;
	border-radius: 10px;        /* CSS3草案 */  
    -webkit-border-radius: 10px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 10px;   /* Firefox用 */ 
	float:left;
}

.inner_qa_box{
	width:100%;
	/*border:1px solid #000000;*/
	padding:10px;
	box-sizing:border-box;
	float:left;
}

.qa_box img{
	width:10%;
	height:auto;
	
}

.qa_text_1{
	width:85%;
	height:auto;
	float:right;
	/*border:1px solid #0C6;*/
	line-height:15px;
}

.qa_text_2{
	width:85%;
	height:auto;
	float:right;
	/*border:1px solid #C33;*/
}


/*----------------
--------------------------------------------------------------スマホ用　アクセスページ*/

/*--------------
--------------------------------------------------------------Google Mapの部分*/
.google-maps {
	width:96%;
position: relative;
margin:0 2% 20px 2%;
padding-bottom: 75%; // これが縦横比
height: 0;
overflow: hidden;
float:left;
}
.google-maps iframe {
position: absolute;
top: 0;
left: 0;
width: 100% !important;
height: 100% !important;
}



.access_box{
	width:96%;
	border:2px solid #036EB8;
	float:left;
	margin:15px 2% 15px 2%;
	padding:15px;
	box-sizing:border-box;
	border-radius: 10px;        /* CSS3草案 */  
    -webkit-border-radius: 10px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 10px;   /* Firefox用 */ 
}


.access_text_1{
	font-size:20px;
	width:80%;
	float:left;
	padding:0 0 0 25px;
}


.access_text_2{
	width:80%;
	float:left;
	line-height:20px;
	margin:15px 0 0 0;
	/*border:1px solid #FF0000;*/
}


.access_bus{
	background-image: url(../trimoff_ss_img/icon_bus.svg);
	background-repeat: no-repeat;
}


.access_train{
	background-image:url(../trimoff_ss_img/icon_train.svg);
	background-repeat: no-repeat;
}


.access_time{
	background-image:url(../trimoff_ss_img/icon_watch.svg);
	background-repeat: no-repeat;
}


.access_address{
	background-image:url(../trimoff_ss_img/icon_address.svg);
	background-repeat: no-repeat;
}




/*--------------------
--------------------------------------------------------------スマホ版トップページコンセプト部分*/
#contents{
	width:100%;
	padding:5% 0% 5% 0%;
	/*background:#f0f8ff;*/
	float:left;
	font-size:13px;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro","メイリオ", Meiryo, Osaka;
	box-sizing: border-box;
}



/*----------
--------------------------------------------------------------スマホ用の汎用コンテンツボックス設定*/
#contents_hanyou{
	width:100%;
	padding:0% 0% 5% 0%;
	float:left;
	font-size:13px;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro","メイリオ", Meiryo, Osaka;
	box-sizing: border-box;
}



/*----------
--------------------------------------------------------------スマホ用の汎用コンテンツボックス内の見出し設定*/



/*--------------------------------------------------------------------------------スマホ用メインコンテンツ*/




/*--------------------
--------------------------------------------------------------スマホ用モデル名h2画像の下の段落　テキストのモデル名*/
.danraku{
	width:94%;
	border-top:1px solid #AAAAAA;
	border-bottom:1px solid #AAAAAA;
	padding:7px 0 5px 6%;
	font-size:16px;
	float:left;
}







/*--------------------
--------------------------------------------------------------スマホ用ページ右部分サイドメニューボックス*/
#side_menu_box{
	width:100%;
	float:right;
	display:block;
	text-align:center;
	padding:0 0 6% 0;
	box-sizing: border-box;

}



/*---------------------
--------------------------------------------------------------social関係（サイドバーのTwitter、facebook、インスタグラムのロゴマーク）*/
.sns_box{
	width:96%;
	height:auto;
	margin:20px 2% 20px 2%;
	padding:0 0 0 0;
	float:left;
	/*border:1px solid #000000;*/
	overflow:auto;
	text-align:center;
}

.sns_box img{
	/*border:1px solid #FF0000;*/
	width:20%;
	height:auto;
	padding:2%;
}


.sns_box_watanabe{
	width:15%;
	height:auto;
	margin:5px 0 0 0;
	padding:0 0 0 0;
	float:right;
	/*border:1px solid #000000;*/
	/*overflow:auto;*/
	text-align:right;
}

.sns_box_watanabe img{
	/*border:1px solid #FF0000;*/
	width:80%;
	height:auto;
	padding:2%;
}




/*------------------------------------
--------------------------------------------------------------ページ右のサイドバー内のスポンサーのバナーが入るボックス*/
#sponsor_box{
	width:100%;
	height:auto;
	float:left;
	margin:15px 0 0 0;
	/*background-color:#33CCFF;*/
}

.sponsor{
	width:98%;
	height:auto;
	margin:0 0 15px 0;
	float:left;
	border:1px solid #000000;
}

.sponsor img{
	width:100%;
	height:auto;
}


/*------------------------------------
--------------------------------------------------------------SP用トップページ下部のスポンサーのバナーが入るボックス*/

#sponsor_box_TopBottom{
	width:96%;
	height:auto;
	float:left;
	margin:0 2% 20px 2%;
	/*border:1px solid #000000;*/
	/*background-color:#33CCFF;*/
}



.sponsor_TopBottom{
	width:48%;
	height:auto;
	margin:15px 2% 0 0;
	/*padding:0 3% 0 0;*/
	float:left;
}

.sponsor_TopBottom_last{
	width:48%;
	height:auto;
	margin:15px 0 0 0;
	/*padding:0 3% 0 0;*/
	float:right;
}

.sponsor_TopBottom img{
	width:100%;
	height:auto;
	margin:15px 0 0 0;
	padding:0 0 0 0;
	float:left;
}

.sponsor_TopBottom_last img{
	width:100%;
	height:auto;
	margin:15px 0 0 0;
	float:right;
}

.f_s_13{
	font-size:12px;
	width:100%;
	margin:0;
	padding:3px 0 3px 2%;
	float:left;
	text-align:left;
	background-color:#f5f5f5;
	box-sizing:border-box;
}








.footer_bottom_logo{
	width:100%;
}

.footer_bottom_logo img{
	width:50%;
	height:auto;
}


/*--------------------
--------------------------------------------------------------スマホ版コピーライト部分*/
#copyright_box{
	width:100%;
	display:block;
	float:left;
	margin:10px 0 0 0;
	font-size:12px;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro","メイリオ", Meiryo, Osaka;
	
}


/*-----------------------
--------------------------------------------------------------スマホ用問い合わせフォーム、予約フォーム関係の設定*/



#formWrap {
	width:90%;
	margin:0 auto;
}
table.formTable th, table.formTable td {
	width:95%;
	display:block;
	float:left;/*--------------------------------------------------------------追記*/
}
table.formTable th {
	margin-top:5px;
	border-bottom:0;
}
input[type="text"], textarea {
	width:80%;
	padding:5px;
	font-size:110%;
	display:block;
}

input[type="select"]{/*--------------------------------------------------------------追記*/
	width:80%;
	padding:5px;
	font-size:110%;
	display:block;
}
input[type="submit"], input[type="reset"], input[type="button"]{
	display:block;
	width:100%;
	height:40px;
}







/*-------------------
--------------------------------------------------------------スマホ用サンクスページの設定*/
.f_effect_thanks{
	width:96%;
	margin:0 2% 0 2%;
	font-size:15px;
	line-height:35px;
}


.f_effect_thanks_small{
	width:96%;
	margin:20px 2% 0 2%;
	padding:10px 0 10px 0;
	float:left;
	font-size:13px;
	line-height:25px;
	border-top:1px solid #000000;
	border-bottom:1px solid #000000;
}


/*--------------------------------------------------------------微調整*/
.f_s_12{
	font-size:12px;
	width:96%;
	margin:0 2% 10px 2%;
	float:left;
	text-align:left;
	background-color:#f5f5f5;
}


/*--------------------------------------------------------------その他のサービス*/
h5.other_5{
	font-size:24px;
	font-weight:bold;
	text-align:center;
	margin:15px 0 0 0;
}
	
.tel {
	font-size: 2em;	/*文字サイズ*/
	font-weight:bold;
}
	
.tel img{
	width: 25px;	/*文字サイズ*/
	height:auto;
	margin:0 3px -3px 0;
}

.tel a{
	text-decoration: none;	
	}
	
.tel a:hover{
	text-decoration: none;	
	color:#555555;
	}	



}