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


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


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


/*角丸ボックス*/
.box29 {
    /*margin: 2em 0;*/
	margin:0 0 30px 0;
    background: #5fb3f5;
	border-radius: 20px;
	padding:0 3px 0px 3px;
}
.box29 .box-title {
    font-size: 25px;
    background: #5fb3f5;
    padding: 10px 10px 10px 10px;
    text-align: center;
    color: #FFF;
    font-weight: bold;
    letter-spacing: 0;
	border-radius: 20px 20px 0px 0px;
	font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
}

.box29 p {
    padding: 15px 20px;
    margin: 0;
}

.box29 .p-box img {
	width:100%;
	height:auto;
    margin: 0;
	box-sizing: border-box;
	border-radius: 0px 0px 19px 19px;
}

.box30 {
    /*margin: 2em 0;*/
	margin:0 0 30px 0;
    background: #5fb3f5;
	border-radius: 20px;
	padding:0 3px 3px 3px;
}

.box30 .box-title2 {
    font-size: 25px;
    background: #5fb3f5;
    padding: 10px 10px 10px 10px;
    text-align: center;
    color: #FFF;
    font-weight: bold;
    letter-spacing: 0;
	border-radius: 20px 20px 0px 0px;
	font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
}

.box30 .box-title3 {
    font-size: 17px;
    background: #5fb3f5;
    padding: 10px 10px 10px 10px;
    text-align: center;
    color: #FFF;
    font-weight: bold;
    letter-spacing: 0;
	border-radius: 20px 20px 0px 0px;
	font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
}

.box30 .inner-box{
	width:100%;
	height:auto;
	margin: 0;
	padding:0 0 0 0;
	border-radius: 0px 0px 19px 19px;
	box-sizing: border-box;
	background-color: #FFFFFF;
}

.box30 .inner-box p{
	text-align:center;
	font-size: 14px;
	line-height: 20px;
    padding: 15px 20px;
    margin: 0;
	font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
}


.box30 .inner-box p.three-gyou{
	text-align:center;
	font-size: 14px;
	line-height: 19px;
    padding: 6px 20px;
    margin: 0;
	font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
}



.eigyou-left-box{
	width:50%;
	padding:0 0 0 30px;
	height:auto;
	background-color: #FFFFFF;
	float:left;
	box-sizing: border-box;
	line-height: 25px;
	font-size: 16px;
	font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
}

.eigyou-right-box{
	width:50%;
	height:auto;
	float:left;
	background-color: #FFFFFF;
	padding:0 0 0 20px;
	margin:0 0 20px 0;
	box-sizing: border-box;
	line-height: 25px;
	font-size: 16px;
	font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
}

h3{
	font-size:18px;
	font-weight:bold;
	margin:0px 0 0 0;
	padding:20px 0 20px 0;
	text-align:center;
	letter-spacing: -0.05em;
	line-height: 1.5em;
	width:100%;
	font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
}

table{
	width:100%;
	font-size: 15px;
	font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
	line-height: 20px;
	margin:20px 0 20px 0;
}

table tr th{
	border-top:solid 1px;
	border-bottom: solid 1px;
	padding:10px;
	
}

table tr td{
	border-top:solid 1px;
	padding:10px;
	border-bottom: solid 1px;
}

.rinen{
	font-size: 20px;
	font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
	text-align: center;
	margin:60px 0 70px 0;
	float: left;
	width:100%;
	
}

.bosyuu{
	font-size: 20px;
	font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
	text-align: center;
	margin:0 0 70px 0;
	width:100%;
	line-height: 32px;
	
}

.bosyuu a{
	font-size: 20px;
	font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
	text-align: center;
	margin:0 0 70px 0;
	width:100%;
	line-height: 32px;
	text-decoration: none;
	color:#000000;
}

.bosyuu a:hover{
	font-size: 20px;
	font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
	text-align: center;
	margin:0 0 70px 0;
	width:100%;
	line-height: 32px;
	text-decoration:underline;
	color:#0000cd;
}




.syokusyu{
	font-size: 15px;
	font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
	line-height: 20px;
	margin:0 auto 0px auto;
	padding:50px 0 0 0;
	width:36%;
	height:140px;
	overflow: auto;
}

.mail-p-box{
	width:8%;
	height:50px;
	margin:0 auto 0 auto;
	padding:60px 0 20px 0;
	overflow:hidden;
	display: block;
}

.mail-p-box img{
	width:100%;
	height:auto;
	
}

footer img{
	width:15%;
	height:auto;
}

.Company-name{
	font-size: 15px;
	font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
	line-height: 20px;
	font-weight: bold;
	
}

.giusto-add{
	font-size: 15px;
	font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
	line-height: 20px;
}





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


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


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

フォント関係*/
h1.page_name{
	font-size: 25px;
	border-bottom: 5px solid #87cefa;
	margin: 30px 0 20px 0;
	padding: 10px 0 10px 0px;
	font-family: Arial, Helvetica, sans-serif;
	color: #0095d9;
	/*background-image: url(../sss-img/sss-icon.svg);
	background-repeat: no-repeat;
	background-position: left center;
	background-size:3.5%;*/
}

h2.page_name{
	font-size: 20px;
	/*border-bottom: 5px solid #0095d9;*/
	margin: 10px 0 10px 0;
	padding: 10px 0 10px 20px;
	font-family:YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
	color: #FFFFFF;
	background-color: #87cefa;
	border-radius: 20px;
	/*background-image: url(../sss-img/icon_common.svg);*/
	/*background-repeat: no-repeat;*/
	/*background-position: left center;*/
	/*background-size:4%;*/
}

.title-box{
	width:100%;
	float:left;
	margin:50px 0 30px 0;
}

.top_page_name{
	font-size: 25px;
	font-weight:bold;
	border-top: 2px solid #0095d9;
	border-bottom: 2px solid #0095d9;
	margin: 0 0 15px 0;
	padding: 10px 0 10px 0;
	text-align:center;
	font-family: Arial, Helvetica, sans-serif;
	color: #000000;
	display: block;
	float:left;
	width:100%;
}

/*---------------------------------トップページ小見出し*/
.top_komidashi_group{
	font-size:25px;
	color:#FFFFFF;
	font-weight:bold;
	padding:10px 0 10px 0;
	background-color:#87cefa;
	border-radius: 20px;
}



.top_komidashi_private{
	font-size:25px;
	color:#800000;
	font-weight:bold;
	padding:10px 0 10px 0;
	/*background-color:#191970;*/
	background-image: url("../sss-img/gold-bg.svg");
	background-size: cover;
	border-radius: 20px;
}



.top_komidashi_nature{
	font-size:25px;
	color:#FFFFFF;
	font-weight:bold;
	padding:10px 0 10px 0;
	background-color:#3cb371;
	border-radius: 20px;
}


.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;
}


/*------------------------------------------------------------------------------パソコン用トップページ関係の設定*/
.top_lesson_box{
	width:100%;
	height:auto;
	float:left;
	box-sizing:border-box;
}


.top_inner_lesson_box{
	width:32%;
	height:auto;
	float:left;
	margin:0 2% 0 0;
}

.top_inner_lesson_box_last{
	width:32%;
	height:auto;
	float:left;
	margin:0 0 0 0;
}

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


.top_half_box{
	width:492px;
	height:auto;
	/*border:1px solid #06F;*/
	float:left;
	box-sizing:border-box;
	margin:0 10px 0 10px;
}

.top_half_box img{
	width:100%;
	height:auto;
	border-radius: 10px;
}


.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;
}


/*-------------------ページトップへ戻る丸矢印の設定*/
.parent-box-arrow{
	float:right;
	width:100px;
	
}

.parent-box-arrow img{
	width:40%;
	height:auto;
	float: right;
	padding:10px 0 10px 0;
}



/*---------------------
-------------------------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:96%;
	margin: 2% 2% 0 2%;
}

.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{
	margin:35px auto 0 auto;
	padding:35px 0 50px 0;
	width:35%;
	height:auto;
	/*border:1px solid #080;*/
}

#logo_box img{
	width:100%;
	height:auto;
	display:block;
}


/*--------------------
--------------------------------------------------------------パソコン用ヘッダー内の社名、住所、電話番号などテキストの入ったボックス*/
.info_box{
	width:250px;
	height:auto;
	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;
}

.syamei img{
	width:70%;
	height:auto;
	margin:0 0 5px 0;
}

.syamei-sp img{
	width:50%;
	height:auto;
	margin:0 0 5px 0;
}



/*----------------------------
--------------------------------------------------------------パソコン用トップページ用のコンテンツの設定*/
#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:1024px;
	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.group-color a{
	display:block;
	width:23%;
	margin:0 1% 0 1%;
	padding:15px 0 15px 0;
	border-right:1px solid #FFFFFF;
	background-color:#1e90ff;
	font-size:14px;
	color:#FFFFFF;
	text-align:center;
	float:left;
	text-decoration:none;
	transition: .4s;
	border-radius: 10px;
	box-sizing: border-box;
	
}

#menu li.group-color a:hover{
	background-color:#4169e1;
	color:#FFFFFF;
}

/*プライベートレッスン部分*/
#menu li.private-color a{
	display:block;
	width:23%;
	margin:0 1% 0 1%;
	padding:15px 0 15px 0;
	border-right:1px solid #FFFFFF;
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#f4dc00+0,e8cc00+26,c9a700+50,f4f400+76,eaac00+90,a57400+100 */
background: #f4dc00; /* Old browsers */
background: -moz-linear-gradient(top,  #f4dc00 0%, #e8cc00 26%, #c9a700 50%, #f4f400 76%, #eaac00 90%, #a57400 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #f4dc00 0%,#e8cc00 26%,#c9a700 50%,#f4f400 76%,#eaac00 90%,#a57400 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #f4dc00 0%,#e8cc00 26%,#c9a700 50%,#f4f400 76%,#eaac00 90%,#a57400 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f4dc00', endColorstr='#a57400',GradientType=0 ); /* IE6-9 */
font-size:14px;
	color:#FFFFFF;
	text-align:center;
	float:left;
	text-decoration:none;
	transition: .4s;
	border-radius: 10px;
	box-sizing: border-box;
	
}

#menu li.private-color a:hover{
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#f4dc00+0,e8cc00+35,c9a700+67,a57400+100 */
background: #f4dc00; /* Old browsers */
background: -moz-linear-gradient(top,  #f4dc00 0%, #e8cc00 35%, #c9a700 67%, #a57400 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #f4dc00 0%,#e8cc00 35%,#c9a700 67%,#a57400 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #f4dc00 0%,#e8cc00 35%,#c9a700 67%,#a57400 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f4dc00', endColorstr='#a57400',GradientType=0 ); /* IE6-9 */
color:#FFFFFF;
}

/*クルージングコース部分*/
#menu li.cruising-color a{
	display:block;
	width:23%;
	margin:0 1% 0 1%;
	padding:15px 0 15px 0;
	border-right:1px solid #FFFFFF;
	background-color:#3cb371;
	font-size:14px;
	color:#FFFFFF;
	text-align:center;
	float:left;
	text-decoration:none;
	transition: .4s;
	border-radius: 10px;
	box-sizing: border-box;
	
}

#menu li.cruising-color a:hover{
	background-color:#0C964A;
	color:#FFFFFF;
}

/*その他のサービス*/
#menu li.other-color a{
	display:block;
	width:23%;
	margin:0 1% 0 1%;
	padding:15px 0 15px 0;
	border-right:1px solid #FFFFFF;
	background-color:#00ced1;
	font-size:14px;
	color:#FFFFFF;
	text-align:center;
	float:left;
	text-decoration:none;
	transition: .4s;
	border-radius: 10px;
	box-sizing: border-box;
	
}

#menu li.other-color a:hover{
	background-color:#20b2aa;
	color:#FFFFFF;
}




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


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

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

.premium_banner{
	width:96%;
	height:auto;
	float:left;
	clear:both;
	margin:0 2% 2% 2%;
	box-sizing: border-box;
}

.premium_banner img{
	width:100%;
	height:auto;
	border-radius: 20px;
}


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

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


.three img{
	width:100%;
	height:auto;
	border-radius: 10px;
}


/*インストラクターからのメッセージ設定*/
.arrow_box{
    position:relative;
    width:400px;
    height:25px;
    background:#0099FF;
	margin:20px 0 0 0;
    padding:10px;
    text-align:center;
    color:#FFFFFF;
    font-size:20px;
    font-weight:bold;
    border-radius:10px;
    -webkit-border-radius:10px;
    -moz-border-radius:10px;
}
.arrow_box:after{
    border: solid transparent;
    content:'';
    height:0;
    width:0;
    pointer-events:none;
    position:absolute;
    border-color: rgba(0, 153, 255, 0);
    border-top-width:10px;
    border-bottom-width:10px;
    border-left-width:10px;
    border-right-width:10px;
    margin-left: -10px;
    border-top-color:#0099FF;
    top:100%;
    left:18%;
}



/*----------------------
--------------------------------------------------------------右側のテキストの入っているボックス*/
.seven{
	width:47%;
	/*border:1px solid #FF0000;*/
	margin:15px 2% 15px 2%;
	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;
	line-height: 1.2em;
}


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


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

.comment p{
	margin:10px 0 0 0;
	font-size:14px;
	line-height:22px;
	letter-spacing: -0.05em;
}

.comment img{
	width:100%;
	height:auto;
	border-radius: 10px;
}

/*---------------------------------------------------レッスン予約ボタン設定*/
.reservatiob-btn{
	/*border:1px solid #000000;*/
	text-align: center;
}

.btn-flat-border {
  display: inline-block;
  padding: 0.5em 1em;
  text-decoration: none;
  color: #67c5ff;
  border: solid 2px #67c5ff;
  border-radius: 3px;
  transition: .4s;
  font-size: 20px;
  margin:20px 0 0 0;
  box-sizing: border-box;
  width:100%;
}

.btn-flat-border:hover {
  background: #67c5ff;
  color: white;
}


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

.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;
}


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





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;
	letter-spacing: -0.05em;
}


h5{
	font-size:30px;
	font-weight:bold;
	text-align:right;
	letter-spacing: -0.03em;
}

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;
	letter-spacing: -0.05em;
}

h7{
	font-size: 18px;
	font-weight:bold;
	color:#0033ff;
	display:inline-block;
	margin: 10px 0 0 0;
	padding:0 0 0 0;
	letter-spacing: -0.1em;
}

.small-text{
	font-size: 15px;
	margin: 10px 0 0 0;
	padding:0 0 0 0;
}


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

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:0;
	float:left;
	font-weight:bold;
	text-align: center;
}


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


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



/*------------------
--------------------------------------------------------------パソコン用　写真とテキストが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カラムレイアウト　インストラクターページのみ*/

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

.photo-box img{
	float:left;
	width:45%;
	height:auto;
	border-radius: 10px;
	margin:0 2% 0 2%;
	/*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:96%;
	margin:2% 2% 0 2%;
}





.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:70px;
	font-size: 14px;
	/*border:1px solid #FF0000;*/
}

.qa_text_2{
	width:680px;
	float:right;
	line-height:20px;
	font-size: 14px;
	/*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(../sss-img/icon_bus.svg);
	background-repeat: no-repeat;
}


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


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


.access_address{
	background-image:url(../sss-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;
	/*background-color:#33CCFF;*/
}

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


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

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

.sponsor_TopBottom img{
	width:18.4%;
	height:auto;
	margin:10px 0 0 0;
	padding:0 2% 0 0;
	float:left;
	
}










/*-------------
--------------------------------------------------------------パソコン用コンセプトのテキストを囲うボックス*/
#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;
	transition: .4s;
}


/*------------
--------------------------------------------------------------パソコン用メインビジュアル画像設定*/
#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:#5fb3f5;
	float:left;
	font-size:15px;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro","メイリオ", Meiryo, Osaka;
	}


/*--------------------
--------------------------------------------------------------フッターメニュー横並び*/
.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 p{
	width:100%;
	display:block;
	float:left;
	margin:10px 0 10px 0;
	font-size:12px;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro","メイリオ", Meiryo, Osaka;
	text-align: center;
	
}


/*--------------------------------------------
--------------------------------------------------------------パソコン用問い合わせフォーム、予約フォーム関係の設定*/
#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;
}




/*-----------------
--------------------------------------------------------------パソコン用サンクスページの設定*/
.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;
}

.midashi_3{
	display: block;
	width:100%;
	overflow: auto;
}








/* ------------------------------------------------ */
/* レスポンシブ（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;*/
}

/*--------------------------------
--------------------------------------------------------------2017/8/9　フォント関係*/
.page-title{
	width:100%;
	/*border:1px solid #000000;*/
	margin: 60px 0 0 0;
	float:left;
	}
	
h1.page_name{
	font-size: 20px;
	border-bottom: 5px solid #87cefa;
	margin: 5px 2% 20px 2%;
	padding: 10px 0 10px 0;
	font-family: Arial, Helvetica, sans-serif;
	color: #0095d9;
}
	
h2.page_name{
	font-size: 20px;
	/*border-bottom: 5px solid #0095d9;*/
	margin: 10px 2% 10px 2%;
	padding: 10px 0 10px 20px;
	font-family: -apple-system, BlinkMacSystemFont, 'Hiragino Sans', 'Hiragino Kaku Gothic ProN', '游ゴシック  Medium', meiryo, sans-serif,;
	color: #FFFFFF;
	background-color: #87cefa;
	border-radius: 20px;
}	



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


/*--------------------
--------------------------------------------------------------スマホ版ヘッダー内のロゴ画像*/
#logo_box img{
	width:100%;
	height:auto;
	margin:5% auto 5% auto;
	/*display:block;*/
	/*text-align: center;*/
}


/*--------------------
--------------------------------------------------------------スマホ版ヘッダー内の社名、住所、電話番号などテキストの入ったボックス*/
.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_sp{
	width:100%;
	height:auto;
	float:left;
	padding:50px 0 0 0;
}


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



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




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


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


.top_inner_lesson_box{
	width:96%;
	height:auto;
	float:left;
	margin:20px 2% 0 2%;
}


.top_inner_lesson_box img{
	width:100%;
	height:auto;
}
	
.top_inner_lesson_box_last{
	width:96%;
	height:auto;
	float:left;
	margin:20px 2% 0 2%;
}	



.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;
}

.top_komidashi_group{
	font-size:35px;
	color:#FFFFFF;
	font-weight:bold;
	padding:10px 0 10px 0;
	background-color:#87cefa;
	border-radius: 20px;
	line-height: 45px;
	}	
	
.top_komidashi_private{
	font-size:35px;
	color:#FFFFFF;
	font-weight:bold;
	padding:10px 0 10px 0;
	background-color:#191970;
	border-radius: 20px;
	line-height: 45px;
	}	
	
.top_komidashi_nature{
	font-size:35px;
	color:#FFFFFF;
	font-weight:bold;
	padding:10px 0 10px 0;
	background-color:#3cb371;
	border-radius: 20px;
	line-height:45px;
}
	
.top_half_box{
	width:96%;
	height:auto;
	/*border:1px solid #06F;*/
	float:left;
	box-sizing:border-box;
	margin:0 2% 10px 2%;
}

.top_half_box img{
	width:100%;
	height:auto;
	border-radius: 10px;
}	

/*-------------------ページトップへ戻る丸矢印の設定*/
.parent-box-arrow{
	float:right;
	width:100px;
	
}

.parent-box-arrow img{
	width:40%;
	height:auto;
	float: right;
	padding:0 10px 10px 0;
}


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


/*グループレッスン部分*/
#menu li.group-color a{
	display:block;
	width:48%;
	margin:1% 1% 0 1%;
	padding:15px 0 15px 0;
	border-right:1px solid #FFFFFF;
	background-color:#1e90ff;
	font-size:14px;
	color:#FFFFFF;
	text-align:center;
	float:left;
	text-decoration:none;
	transition: .4s;
	border-radius: 10px;
	box-sizing: border-box;
	
}

#menu li.group-color a:hover{
	background-color:#4169e1;
	color:#FFFFFF;
}

/*プライベートレッスン部分*/
#menu li.private-color a{
	display:block;
	width:48%;
	margin:1% 1% 0 1%;
	padding:15px 0 15px 0;
	border-right:1px solid #FFFFFF;
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#f4dc00+0,e8cc00+26,c9a700+50,f4f400+76,eaac00+90,a57400+100 */
background: #f4dc00; /* Old browsers */
background: -moz-linear-gradient(top,  #f4dc00 0%, #e8cc00 26%, #c9a700 50%, #f4f400 76%, #eaac00 90%, #a57400 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #f4dc00 0%,#e8cc00 26%,#c9a700 50%,#f4f400 76%,#eaac00 90%,#a57400 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #f4dc00 0%,#e8cc00 26%,#c9a700 50%,#f4f400 76%,#eaac00 90%,#a57400 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f4dc00', endColorstr='#a57400',GradientType=0 ); /* IE6-9 */
	background-size: cover;
	font-size:14px;
	color:#FFFFFF;
	text-align:center;
	float:left;
	text-decoration:none;
	transition: .4s;
	border-radius: 10px;
	box-sizing: border-box;
	
}

#menu li.private-color a:hover{
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#f4dc00+0,e8cc00+35,c9a700+67,a57400+100 */
background: #f4dc00; /* Old browsers */
background: -moz-linear-gradient(top,  #f4dc00 0%, #e8cc00 35%, #c9a700 67%, #a57400 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #f4dc00 0%,#e8cc00 35%,#c9a700 67%,#a57400 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #f4dc00 0%,#e8cc00 35%,#c9a700 67%,#a57400 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f4dc00', endColorstr='#a57400',GradientType=0 ); /* IE6-9 */
	color:#FFFFFF;
}

/*クルージングコース部分*/
#menu li.cruising-color a{
	display:block;
	width:48%;
	margin:1% 1% 0 1%;
	padding:15px 0 15px 0;
	border-right:1px solid #FFFFFF;
	background-color:#3cb371;
	font-size:14px;
	color:#FFFFFF;
	text-align:center;
	float:left;
	text-decoration:none;
	transition: .4s;
	border-radius: 10px;
	box-sizing: border-box;
	
}

#menu li.cruising-color a:hover{
	background-color:#0C964A;
	color:#FFFFFF;
}

/*その他のサービス*/
#menu li.other-color a{
	display:block;
	width:48%;
	margin:1% 1% 0 1%;
	padding:15px 0 15px 0;
	border-right:1px solid #FFFFFF;
	background-color:#00ced1;
	font-size:14px;
	color:#FFFFFF;
	text-align:center;
	float:left;
	text-decoration:none;
	transition: .4s;
	border-radius: 10px;
	box-sizing: border-box;
	
}

#menu li.other-color a:hover{
	background-color:#20b2aa;
	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;
}
	
.premium_banner{
	width:96%;
	height:auto;
	float:left;
	clear:both;
	margin:0 2% 2% 2%;
	box-sizing: border-box;
}

.premium_banner img{
	width:100%;
	height:auto;
	border-radius: 20px;
}



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

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


/*---------------
--------------------------------------------------------------テキストの入っているボックス*/
.seven{
	width:88%;
	/*border:1px solid #FF0000;*/
	margin:15px 6% 15px 6%;
	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;*/
}
	
.comment p{
	margin:10px 0 0 0;
	font-size:14px;
	line-height:22px;
	letter-spacing: -0.05em;
}
	
.comment img{
	width:100%;
	height:auto;
	border-radius: 10px;
}	

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

.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;
	width:100%;
}


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;
}
	
/*---------------------------------------------------レッスン予約ボタン設定*/
.reservatiob-btn{
	/*border:1px solid #000000;*/
	text-align: center;
}

.btn-flat-border {
  display: inline-block;
  padding: 0.5em 1em;
  text-decoration: none;
  color: #67c5ff;
  border: solid 2px #67c5ff;
  border-radius: 10px;
  transition: .4s;
  font-size: 30px;
	line-height:1.2em;
  margin:20px 2% 0 2%;
  box-sizing: border-box;
  width:96%;
}

.btn-flat-border:hover {
  background: #67c5ff;
  color: white;
}



/*---------------
--------------------------------------------------------------パソコン用　写真とテキストが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カラムレイアウト　インストラクターページのみ*/

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


.photo-box img{
	float:left;
	width:96%;
	height:auto;
	border-radius: 10px;
	margin:2% 2% 0 2%;
	/*border:1px solid #FF0000;*/
}


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


.right_b img{
	float:left;
	width:96%;
	height:auto;
	border-radius: 10px;
	margin:10px 2% 0 2%;
	display: block;
}


.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(../sss-img/icon_bus.svg);
	background-repeat: no-repeat;
}


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


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


.access_address{
	background-image:url(../sss-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:47%;
	height:auto;
	margin:0 0 15px 2%;
	float:left;
}

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


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

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



.sponsor_TopBottom img{
	width:46%;
	height:auto;
	margin:10px 0 0 0;
	padding:0 2% 0 2%;
	float:left;
}



.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;
}
	
/*インストラクターからのメッセージ設定*/
.arrow_box{
    position:relative;
    width:96%;
    height:23px;
    background:#0099FF;
	margin:20px 0 0 0;
    padding:10px;
    text-align:center;
    color:#FFFFFF;
    font-size:20px;
    font-weight:bold;
    border-radius:10px;
    -webkit-border-radius:10px;
    -moz-border-radius:10px;
}
.arrow_box:after{
    border: solid transparent;
    content:'';
    height:0;
    width:0;
    pointer-events:none;
    position:absolute;
    border-color: rgba(0, 153, 255, 0);
    border-top-width:10px;
    border-bottom-width:10px;
    border-left-width:10px;
    border-right-width:10px;
    margin-left: -10px;
    border-top-color:#0099FF;
    top:100%;
    left:18%;
}
	
/*2021/2/16追記　ジュースト用	*/
.eigyou-left-box{
	width:100%;
	padding:0 0 0 30px;
	height:auto;
	background-color: #FFFFFF;
	float:left;
	box-sizing: border-box;
	line-height: 25px;
	font-size: 16px;
	font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
}

.eigyou-right-box{
	width:100%;
	height:auto;
	float:left;
	background-color: #FFFFFF;
	padding:0 0 0 30px;
	margin:0 0 20px 0;
	box-sizing: border-box;
	line-height: 25px;
	font-size: 16px;
	font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
}
	
	
.mail-p-box{
	width:16%;
	height:50px;
	margin:0 auto 0 auto;
	padding:60px 0 20px 0;
	overflow:hidden;
	display: block;
}

.mail-p-box img{
	width:100%;
	height:auto;
	
}	
	
	
footer img{
	width:30%;
	height:auto;
}
	
table{
	width:100%;
	font-size: 15px;
	font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
	line-height: 20px;
	margin:20px 0 20px 0;
}

table tr th{
	border:solid 1px #CCCCCC;
	padding:10px;
	display: block;
	margin:15px 0 0 0;
	background-color: #EFEEEE;
	
}

table tr td{
	border:solid 1px #CCCCCC;
	padding:10px;
	border-bottom: solid 1px #CCCCCC;
	display: block;
}
	
.rinen{
	font-size: 20px;
	font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
	text-align: center;
	margin:60px 0 70px 0;
	float: left;
	width:100%;
	line-height: 30px;
	
}
	
	
.syokusyu{
	font-size: 15px;
	font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif";
	line-height: 20px;
	margin:0 auto 0px auto;
	padding:50px 0 0 0;
	width:92%;
	height:140px;
}
	
	


}
