@charset "utf-8";

/*==================================================================================================================
リセット
==================================================================================================================*/
/*リセット*/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, div, dfn, em, img, ins, kbd, q, s, samp, small, strike, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, hgroup, menu, nav, output, ruby, summary, time, mark, audio, video {
	margin:0;
	padding:0;
	text-align:left;
	font-weight:normal;
  	font-style:normal;
	background-repeat:no-repeat;
	border:0 none;
}

/*
:target::before { padding-top: 80px; margin-top:-80px; content:""; display:block; }
*/

:target:before {
   content:"";
   display:block;
   height:80px;/* ヘッダの高さ = 50px */
   margin:-80px 0 0;/* ヘッダの高さ = 50px */
}

/*==================================================================================================================
再定義
==================================================================================================================*/
/*基本リンク
------------------------------------------------------------------------------------------------------------------*/

/*
a:hover img, a:focus img {
	opacity:0.75;
	filter:alpha(opacity=75);
}
*/

/*リスト
------------------------------------------------------------------------------------------------------------------*/
ol, ul, li {
	list-style-image:none;
	list-style-position:outside;
	list-style-type:none;
}

/* paddingやborderも widthに含める形式に統一
------------------------------------------------------------------------------------------------------------------*/
* { box-sizing:border-box; }

/*==================================================================================================================
クリア
==================================================================================================================*/
.clear {
	clear:both;
	size:0;
}
.clearfix {
	display: inherit;
}
.clearfix:after {
	visibility: hidden;
	display: block;
	font-size: 0;
	clear: both;
	height: 0;
	content:"";
	zoom:1;
}
/* IE6 */
* html .clearfix {
	zoom: 1;
}
/* IE7 */
*:first-child+html .clearfix {
	zoom: 1;
}
/* Hides from IE-mac \*/  
* html .clearfix {
	height: 1%;
}
.clearfix {
	display: block;
}
/* End hide from IE-mac */  



/*==================================================================================================================
フォントに関する基本スタイル
==================================================================================================================*/
/*基本文字サイズ&文字色
------------------------------------------------------------------------------------------------------------------*/
body {
	font-size:62.5%;/*10px相当にリセット*/
	font-family: "Noto Sans Japanese","Helvetica Neue","游ゴシック Medium",YuGothic,YuGothicM,"Hiragino Kaku Gothic ProN",メイリオ,Meiryo,sans-serif;
	line-height:2;
	color:#232323;
}

/*段落*/
p {
	margin:0px 0px 15px 0px;/*下部に余白*/
	font-size: 16px;
}

/*文字サイズ*/
ul, dl{font-size: 16px;}

@media (max-width:499px) {
	body{line-height: 1.7;}
	p, ul, dl{font-size: 15px;}
}


/*基本リンク
------------------------------------------------------------------------------------------------------------------*/
/*リンク文字色*/
a{text-decoration: none;}
a:link    {color:#0099cc;}
a:visited {color:#0099cc;}
a:hover   {color:#00a9f0;}

/*マーカー＆強調文字色
------------------------------------------------------------------------------------------------------------------*/
/*ラインマーカー*/
.cMrk {
	background: linear-gradient(transparent 60%, #e5d89b 0%);
	padding: 0 3px;
}
/*強調文字色*/
.cPtv {color:#d64a5a;}/*positive*/
.cPit {color:#900000;}/*point up*/
.cNgt {color:#5488a2;}/*negative)*/
.cOff {color:#cac5ba;}/*off*/

.att{color:#cc6666;}

.txtBold{
	font-weight: bold;
	font-size: 105%;
}
.bold{
	font-weight: bold;
}

/*右寄せ*/
.txtRight, .txtRight p {
	text-align:right;
}
/*中央寄せ*/
.txtCenter, .txtCenter p {
	text-align:center;
}
/*明朝*/
.f_mn {
	font-family: Georgia,游明朝,"Yu Mincho",YuMincho,"Hiragino Mincho ProN",HGS明朝E,メイリオ,Meiryo,serif;
}

@media (max-width: 499px) {
	.txtBold{font-size: 100%;}
}


/*==================================================================================================================
テーブルに関する設定
==================================================================================================================*/
table {
	border-collapse: collapse;
	border-spacing:0;
}
/*テーブルタイトル*/
caption {
	text-align:left;
	font-weight:bold;
	color:#993300;
}
/*枠線*/
th,td{
	border: #ccc 1px solid;
	padding:8px 15px;
	font-size: 1rem;
}
thead th,tfoot th {
	vertical-align:top;
	background-color:#EFEFEF;
	color:#FFFFFF;
}
thead td,tfoot td {
	vertical-align:top;
	background-color:#999;
	color:#FFFFFF;
}
tbody th {
	vertical-align:top;
	background-color:#F5F5F5;;
}
tbody td {
	vertical-align:top;
	background-color:#fdfcfb;
}

/*その他
-------------------------------------------------------------------------------------------------------------------*/
/*区切り線*/
hr{clear:both;border:0px solid #fff;padding:15px 0;width:0;}

/*画像・オブジェクト*/
img         {border:0 none;vertical-align:top;max-width:100%;}
object	    {text-decoration:none;border:none;margin:0px;padding:0px;vertical-align:bottom;}


/* メニューを非表示にするパターン */
@media (max-width: 499px) {
	.noTab, .noTab caption, .noTab thead, .noTab tfoot, .noTab tbody, .noTab tr, .noTab th, .noTab td { display:block; width:100%; }
}


/*横並びの配置（flexbox）*/

.flex{
	display: -webkit-flex; /* Safari */
	display: flex;
	-webkit-flex-wrap: wrap; /* Safari */
	flex-wrap:         wrap;
}
.fBetween{
	-webkit-justify-content: space-between; /* Safari */
	justify-content: space-between;
}
.fAround{
	-webkit-justify-content: space-around; /* Safari */
	justify-content: space-around;
}
.fCenter{
	-webkit-justify-content: center; /* Safari */
	justify-content: center;
}

.imgRight{float: right;}
.imgLeft{float: left;}
.imgCenter{text-align: center; margin-bottom: 30px;}

.dib{
	display:inline-block;
}


/*インスタグラム*/

#instafeed {
	display: -webkit-flex; /* Safari */
	display: flex;
	-webkit-flex-wrap: wrap; /* Safari */
	flex-wrap:         wrap;
	-webkit-justify-content: space-around; /* Safari */
	justify-content: space-around;
}
#instafeed li { display:inline-block; vertical-align:top; width:31%; height:310px;overflow: hidden;margin-bottom: 20px;} 
#instafeed li img { object-fit: cover; object-position: center; width:100%; height:100%; }

@media (max-width:599px) {
	#instafeed li {height:125px;margin-bottom: 10px;}
}
@media (max-width:320px) {
	#instafeed li {height:100px;margin-bottom: 10px;}
}


/*==================================================================================================================
レイアウト設定
==================================================================================================================*/

/*共通
-------------------------------------------------------------------------------------------------------------------*/

body{}
#container  {
	width: 100%;
	position: relative;
}
.inner{
	width:100%;
	max-width: 1000px;
	margin:0 auto;
}
.inner:after{
	content: "";
	display: block;
	clear: both;
}
#wrappar{}
#wrappar .inner{
    padding: 50px 0;
}

@media (max-width:1100px) {
	.inner{padding: 0 2.5%;}
	#wrappar .inner{padding: 30px 2.5%;}
}
@media (max-width:499px) {
}


/*ヘッダー*/
#header{
}
#hdr_logo{
	display: none;
}

@media (max-width:499px) {
	#hdr_logo{display: inherit;width: 180px;padding: 5px;position: fixed;top: 0;z-index: 999;}
}


/*グローバルメニュー*/
nav{
	position: -webkit-sticky;
    position: sticky;
    top: 0;
    z-index: 9;
}
#gnav{
    border-bottom: 1px #ccc solid;
    padding: 10px 0;
    background: #fff;
}
#gnav a{
    color: #232323;
}
#gnav li{}
#gnav .flex{
    align-items: center;
}
/*
#gnav li#gnav01{background: url(../images/gnav_icon01.png) top center no-repeat;background-size: 30px;padding-top: 25px;margin-top: 5px;}
#gnav li#gnav02{background: url(../images/gnav_icon02.png) top center no-repeat;background-size: 30px;padding-top: 25px;margin-top: 5px;}
#gnav li#gnav03{background: url(../images/gnav_icon03.png) top center no-repeat;background-size: 30px;padding-top: 25px;margin-top: 5px;}
#gnav li#gnav04{background: url(../images/gnav_icon04.png) top center no-repeat;background-size: 30px;padding-top: 25px;margin-top: 5px;}
#gnav li#gnav05{background: url(../images/gnav_icon05.png) top center no-repeat;background-size: 30px;padding-top: 25px;margin-top: 5px;}
#gnav li#gnav06{background: url(../images/gnav_icon06.png) top center no-repeat;background-size: 30px;padding-top: 25px;margin-top: 5px;}
*/
.gnav_smt{display: none;}
/* スマホ用メニュー */
.hm_menu_check { display: none;}
.gnav_smt {position :absolute;top :0;right :0;width :100%;padding :10px;z-index: 999;background: #fff;}
.hm_btn {position: relative;width: 30px;height: 30px;cursor: pointer;display: block;float:right;z-index: 2;}
.hm_btn::before {-webkit-box-shadow: #f47722 0 12px 0;box-shadow: #f47722 0 12px 0;}
.hm_btn::after {bottom: 0;}
.hm_btn::before, .hm_btn::after {width: 30px;height: 6px;background: #f47722;display: block;content: '';position: absolute;-webkit-transition: -webkit-box-shadow 0.2s linear, -webkit-transform 0.2s 0.2s;transition: box-shadow 0.2s linear, transform 0.2s 0.2s;}
.gnav_smt_wrap {width :100%;height :10000px;background:rgba(255,255,255,0.8);position: absolute;right: -100%;top: 50px;-webkit-transition: right 0.4s;transition: right 0.4s;z-index: 9999;}
.hm_menu_check:checked ~ .hm_title {opacity: 1;-webkit-transform: none;-ms-transform: none;transform: none;}
.hm_menu_check:checked ~ .hm_btn::before {-webkit-box-shadow: transparent 0 0 0;box-shadow: transparent 0 0 0;-webkit-transform: rotate(45deg) translate3d(6px, 11px, 0);transform: rotate(45deg) translate3d(6px, 11px, 0);}
.hm_menu_check:checked ~ .hm_btn::after {-webkit-transform: rotate(-45deg) translate3d(6px, -11px, 0);transform: rotate(-45deg) translate3d(6px, -11px, 0);}
.hm_menu_check:checked ~ .gnav_smt_wrap {right: 0;}
.gnav_smt_list {list-style-type: none;margin: 0;padding: 10px;display:flex;flex-wrap: wrap;justify-content: space-between;}
.gnav_smt_list li{border: #fff 1px solid;width:48%;background: rgba(255,255,255,0.8);margin-bottom: 10px;}
.gnav_smt_list li:first-of-type{border-top: #fff 1px solid;}
.gnav_smt_list li a {color: #777;display: block;overflow: hidden;padding: 8px 22px;position: relative;text-decoration: none;z-index: 1;text-align:center;}
.gnav_smt_list li a::before {background: #eee;content: '';position: absolute;top: 0;right: 0;bottom: 100%;left: 0;-webkit-transition: bottom 0.4s;transition: bottom 0.4s;z-index: -1;}/* aタグマウスオーバー時の背景 */
.gnav_smt_list li.cbtn { background:#413d3d; }
.gnav_smt_list li.ubtn { background:#a64e4c; }
.gnav_smt_list li.abtn a { text-align:center; color:#fff; }

@media (max-width:799px) {
}
@media (max-width:599px){
	#gnav li{font-size: 15px;}
}
@media (max-width:499px) {
	nav{position: fixed;width: 100%;}
	.gnav_smt{display: inherit;}
	#gnav{display: none;}
}
@media (max-width:399px) {
}

/*フッター*/
#footer{

}
.ftrLogo{
	text-align:center;
	margin:50px auto;
	width:90%;
	max-width:300px;
}
#copyright{
	text-align:center;
	padding-bottom: 10px;
}
@media (max-width:599px) {

}




/*サイドボタン*/
#side_btn{}
#side_btn a{}
#side_btn i{}

@media (min-width:999px) {

#side_btn a:hover{background:rgba(214,74,90,0.8);border-radius: 50%;}
}

@media (max-width:599px) {
}


/*基本のボタン*/
/*
.btn{
	background: #413d3d;
	width:100%;
	max-width:310px;
    height: 40px;
    line-height: 40px;
}
.btn a{
	color:#fff;
	display:block;
    text-align: center;
    font-size: 17px;
}
*/



/*LP
-------------------------------------------------------------------------------------------------------------------*/

/*メインイメージ*/
#mainVisual{}
#mainVisual img{width: 100%;}

@media (max-width:1099px) {

}
@media (max-width:899px) {
	h2.secTtl{margin-bottom: 25px;}
}
@media (max-width:599px) {

}
@media (max-width:499px) {
	#mainVisual{padding-top: 50px;}
}
@media (max-width:399px) {

}


/*コンテンツ*/
.box{
    margin-bottom: 80px;
}
.imgArea{
    margin-bottom: 40px;
}
.txtArea{
	padding:0 1%;
}
h2.secTtl{
	text-align: center;
    margin-bottom: 40px;
    font-size: 2rem;
    line-height: 1.6;
    font-weight: 600;
}
h2.secTtl .txt_s, h3 span{
	text-align: center;
	display:block;
    font-size: 80%;
}
h3{
	text-align: center;
    margin-bottom: 25px;
    font-size: 1.9rem;
    line-height: 1.7;
}


@media (max-width:1049px) {

}
@media (max-width:699px) {
	h2.secTtl{font-size: 1.3rem;margin-bottom: 20px;}

}
@media (max-width:499px) {

}
@media (max-width:399px) {
}


/*-- sec01 --*/
#sec01{
	background: url(../images/sec01_bg.jpg) top center no-repeat;
	background-size: cover;
}
#sec01 .imgArea{
    max-width: 450px;
    margin: 0 auto 40px;
}
#sec01 .lead p{
	text-align: center;
    font-size: 18px;
}

@media (max-width:699px) {
	#sec01 .imgArea{width: 60%;}
	#sec01 .lead p{font-size: 15px;text-align: left;line-height: 1.6;}
	#sec01 .lead p.name{text-align: right;}
	#sec01 .lead .pc{display:none;}
}
@media (max-width:499px) {
	#sec01 .imgArea{margin-bottom: 20px;}
}


#sec02 .flex{
    flex-direction: row-reverse;
}
#sec02 .imgArea{
    width: 45%;
}
#sec02 .txtArea{
    width:50%;
}

.test211221 #sec02 .imgArea {
	width: calc( 50% - 2px );
}

.test211221 #sec02 .txtArea {
	width: 100%;
	padding: 0;
}

.test211221 #sec02 .act {
	background: #f5f5f5;
	padding: 20px;
	margin: 0 auto 20px;
}

.test211221 #sec02 .act dt {
	font-weight: bold;
	border-bottom: dotted 1px;
	padding-bottom: 0.5em;
	margin-bottom: 0.8em;
}

@media (max-width:699px) {
	#sec02 .imgArea{width: 80%;margin: 0 auto 20px;}
	#sec02 .txtArea{width:100%;}
}



#sec03{
	background: #f8d959;
}
#sec03 .flex{
    align-items: center;
    flex-direction: row-reverse;
}
#sec03 .imgArea, #sec03 .txtArea{
    width:50%;
}
#sec03 .imgArea{
    margin-bottom: 0;
    overflow: hidden;
   height: 450px;
}
#sec03 .imgArea img{
    margin-bottom: 0;
    height: 100%;
    width: 100%;
    object-fit: cover;
}
#sec03 .txtArea{
    padding:30px 20px;
}
#sec03 .txtArea ul{
    margin-bottom: 15px;
}
#sec03 .txtArea ul li{
    line-height: 1.5;
    margin: 0 0 10px 1em;
    padding-left: 1em;
    position: relative;
    font-weight: bold;
}
#sec03 .txtArea ul li:before{
	content:"●";
	position: absolute;
	left:0;
	top:0.35em;
	font-size: 65%;
	color:#fff;
}
#sec03 .txtArea p:last-of-type{
	margin-bottom:0;
}


.test211221 #sec03 .imgArea {
	height: auto;
	width: calc( 50% - 2px );
	margin-bottom: 40px;
}

.test211221 #sec03 .txtArea {
	width: 100%;
	padding: 0;
}


@media (max-width:899px) {
	#sec03 .imgArea{width: 80%;margin: 0 auto 40px;height: auto;}
	#sec03 .txtArea{width:100%;}
	#sec03 .flex{flex-direction: row-reverse;}
}




#sec04{
	background: url(../images/sec04_bg.jpg) top center no-repeat;
	background-size: cover;
}
#sec04 .txtArea, #sec04 dl, #sec04 dd li{
    width:48%;
}
#sec04 dl{
	background: #fff;
    border: 1px #ccc solid;
    padding:20px 25px;
}
#sec04 dt{
    text-align: center;
    font-weight: bold;
    border-bottom: 1px #aaa dotted;
    margin-bottom: 15px;
}

@media (max-width:1099px) {
	#sec04 .txtArea, #sec04 dl{width: 49%;}
}
@media (max-width:999px) {
	#sec04 .txtArea, #sec04 dl{width: 100%;}
}
@media (max-width:599px) {
	#sec04 dd li{width: 100%;}
}


#sec05 .flex{
    align-items: center;
}
#sec05 .imgArea, #sec05 .txtArea{
    width:48%;
}

@media (max-width:699px) {
	#sec05 .imgArea, #sec05 .txtArea{width: 90%;margin:0 auto;}
}



#sec06{
/*	background: #f8d959;*/
	background: url(../images/sec04_bg.jpg) top center no-repeat;
	background-size: cover;

}
/*
#sec06 .flex{
    align-items: center;
}
#sec06 .mapArea, #sec06 .txtArea{
    width:50%;
}
*/
#sec06 .txtArea{
    padding:50px 40px;
    width: 100%;
    max-width: 800px;
    margin: auto;
}
#sec06 .txtArea .flex{
    align-items: inherit;
}
#sec06 .txtArea dt, #sec06 .txtArea dd{
    margin-bottom: 10px;
    border-bottom: 1px #e7ac6e dotted;
    padding-bottom: 10px;
    line-height: 1.6;
}
#sec06 .txtArea dt{
    width:5em;
    font-weight: bold;
    color: #565656;
}
#sec06 .txtArea dd{
    width:calc(100% - 5em);
}
#sec06 .mapArea{
	height: 500px;
}
#sec06 .mapArea iframe{
	height: 100%;
}


@media (max-width:899px) {
	#sec06 .txtArea{padding: 20px;}
}
@media (max-width:799px) {
	#sec06 .txtArea{padding: 20px;}
	#sec06 .mapArea, #sec06 .txtArea{ width:100%;}
	#sec06 .mapArea{height: 350px;}
}
@media (max-width:499px) {
	#sec06 .mapArea {height: 300px;}
}



#sec07 .boxL, #sec07 .boxR{
    width:48%;
    border: 1px #ccc solid;
    padding:25px;
}
#sec07 dl{
	line-height: 1.5;
}
#sec07 .boxL dt, #sec07 .boxL dd, #sec07 .boxR dt, #sec07 .boxR dd{
	margin-bottom: 15px;
    border-bottom: 1px #ccc dotted;
    padding-bottom: 15px;
}
#sec07 .boxL dt, #sec07 .boxR dt{
    width:6em;
    font-weight: bold;
    color: #565656;
}
#sec07 .boxL dd, #sec07 .boxR dd{
    width:calc(100% - 6em);
}
#sec07 .contact{
	margin-top:30px;
	background: #F5F5F5;
    padding: 30px;
}
#sec07 .contact dt{
	margin-bottom:15px;
    font-weight: bold;
    color: #565656;
}

.top_rec_bnr {
	margin: 60px auto;
	max-width: 96vw;
	text-align: center;
}

@media (max-width:999px) {
	#sec07 .boxL, #sec07 .boxR{width:100%;}
	#sec07 .boxL{margin-bottom:15px;}
}
@media (max-width:699px) {
	#sec07 .boxL h3, #sec07 .boxR h3 {font-size: 1.3rem;}
}
@media (max-width:499px) {
	#sec07 .boxL, #sec07 .boxR {padding: 15px;}
	#sec07 .contact{padding: 15px;}
}
@media (max-width:399px) {
	#sec07 dl{font-size: 14px;}

}

.eform table {
	width: 100%;
	max-width: 800px;
	margin: auto;
}

.eform table th {
	width: 30%;
	min-width: 13em;
}

.eform textarea {
	width: 100%;
}

.sform .formNavi {
	font-size: 16px;
}

@media (max-width:499px) {
	.sub_page #wrappar { padding-top: 50px;}
	.eform table tr:not(:last-of-type) { margin-bottom: 1em;}
	.eform table th, .eform table td { border: none;}
	.eform table th { width: 100%;}
}
