@charset "utf-8";
/*==========================================
 device
===========================================*/
.pc_none {display: none !important;}
.sp_none {display: block !important;}
@media screen and (min-width: 0px) and (max-width:768px) {
.pc_none {display: block !important;}
.sp_none {display: none !important;}
}
@media screen and (min-width: 0px) and (max-width:768px) {
.min_img{
	width: 50% !important;
	display: block;
	margin: 0 auto;
}
}

/*==========================================
 layout
===========================================*/
.db,
.btl,
.btc,
.btr {
	display: block;
}
ul[class*="grid"],
div[class*="grid"],
span[class*="grid"]{
	letter-spacing: -.4em;
}
[class*="grid"] li,
[class*="grid"] div,
[class*="grid"] span{
	display:inline-block;
	vertical-align: top;
	letter-spacing: normal;
	padding: 0.5%;
}
.grid2>li,
.grid2>div,
.grid2>span{
	width: 50%;
}
.grid3>li,
.grid3>div,
.grid3>span{
	width: 33.33%;
}
.grid4>li,
.grid4>div,
.grid4>span{
	width: 25%;
}
@media screen and (min-width: 0px) and (max-width:768px) {
.sp_grid1>li,
.sp_grid1>div,
.sp_grid1>span{
	width: 100%;
}
.grid4>li,
.grid4>div,
.grid4>span{
	width: 50%;
}
}

/*==========================================
 title
===========================================*/
/*===h1===*/
h1 {font-size: 10px;}

/*===h2===*/
h2{
    font-size: 25px;
	text-align: center;
	line-height: 1.4;
	margin-bottom: 30px;
}
/*下層先頭*/
h2.low-top{
	background: #f7f5f0;
	padding: 20px 0;
	color: #fff;
    font-weight: 700;
    font-size: 35px;
}
/*h2.low-top_low_template{
	color: #fff;
	padding: 150px 0;
    background: url(../img/index/concept_bg.jpg) no-repeat center center;
}*/
#sub_mv {
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    height: 300px;
    position: relative;
	margin-bottom: 30px;
}
#sub_mv .title {
    color: #ffffff;
    font-size: 35px;
    font-weight: bold;
    line-height: normal;
    padding-bottom: clamp(20px);
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
    width: 100%;
}
#sub_mv::before {
    background-color: #cccccc;
    content: "";
    height: 100%;
    mix-blend-mode: multiply;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
}
#page p, #blog p {
    margin-bottom: 30px;
    letter-spacing: 0.03em;
}
.js-opacity.is-inview {
    opacity: 1;
    transition-delay: .5s;
}
.js-opacity {
    opacity: 0;
    transition: opacity .8s, transform .8s;
}
#sub_mv .title::before {
    background-color: #ffffff;
    content: "";
    height: 2px;
    position: absolute;
    left: 50%;
    bottom: -10px;
    transform: translateX(-50%);
    width: clamp(60px, 7.81vw, 80px);
}
#sub_mv img {
    height: 100%;
    object-fit: cover;
}

@media screen and (min-width: 0px) and (max-width:768px) {
#sub_mv {
        height: clamp(200px, 48.83vw, 500px);
}
#sub_mv .title {
    font-size: 18px;
}
h2 {
	font-size: 18px;
	margin-bottom: 20px;
	padding: 15px 0;
}
}

/*===h3===*/
h3{
	position: relative;
	font-size: 26px;
	/*font-weight: bold;*/
	border-bottom: 2px solid #999;
	padding: 0 0 .3em 8px;
	margin: 0 0 20px 0;
	text-align: center;
}
@media screen and (min-width: 0px) and (max-width:768px) {
h3 {
	font-size: 18px;
	padding: 0 0 .3em 0;
	margin-bottom: 10px;
	line-height: 1.7;
	font-weight: 600;
}
}

/*===h4===*/
h4_low{
	font-size: 16px;
	font-weight: bold;
	border-left: 4px solid #666;
	padding: 0 0 0 8px;
	margin: 0 0 .5em 0;
}

h5 {
font-size:1.1rem;
line-height: 2.75rem;
font-weight: 600;
}





/*===見出し装飾===*/
/*短い中央下ライン*/
.ttl--lineBtm{
	position: relative;
	padding-bottom: 10px;
}
.ttl--lineBtm::after{
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	content: "";
	width: 60px;
	border-bottom: 1px solid #666;
	margin: auto;
}
/*短い右下ライン*/
.ttl--lineSide {
	position: relative;
	display: inline-block;
	padding: 0 90px 0 0;
	text-align: left;
}
/*.ttl--lineSide::before,*/
.ttl--lineSide::after {
	content: '';
	position: absolute;
	top: 50%;
	display: inline-block;
	width: 64px;
	height: 1px;
	background: #5a3322;
	margin-left: 20px;
}
/*短い右下ライン_コンセプト*/
.ttl--lineSide_concept {
	position: relative;
	display: inline-block;
	padding: 0 90px 0 220px;
}
.ttl--lineSide_concept::after {
	content: '';
	position: absolute;
	top: 50%;
	display: inline-block;
	width: 64px;
	height: 1px;
	background: #fff;
	margin-left: 25px;
}
/*短い右下ライン_あいさつ*/
.ttl--lineSide_message {
	position: relative;
	display: inline-block;
	padding: 0 90px 0 220px;
}
.ttl--lineSide_message::after {
	content: '';
	position: absolute;
	top: 50%;
	display: inline-block;
	width: 64px;
	height: 1px;
	background: #5a3322;
	margin-left: 25px;
}
/*短い右下ライン_info*/
.ttl--lineSide_info {
	position: relative;
	display: inline-block;
	padding: 0 90px 0 220px;
}
.ttl--lineSide_info::after {
	content: '';
	position: absolute;
	top: 50%;
	display: inline-block;
	width: 64px;
	height: 1px;
	background: #5a3322;
	margin-left: 25px;
}
@media screen and (min-width: 0) and (max-width:768px) {
.ttl--lineSide_concept {
    padding: 0 90px 0 5%;
	text-align: left;
}
.ttl--lineSide_message {
    padding: 0 90px 0 5%;
	text-align: left;
}
.ttl--lineSide_info {
    padding: 0 90px 0 5%;
	text-align: left;
}
}

/*==========================================
 text
===========================================*/
/*===書体===*/
.font_sans{
	font-family: "游ゴシック", "Yu Gothic", YuGothic,'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro', 'メイリオ','Meiryo','Osaka',Verdana,'ＭＳ Ｐゴシック','MS P Gothic',Arial,Helvetica,sans-serif;
}
.font_serif{
	font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro","ＭＳ Ｐ明朝", "MS PMincho", serif;
}

/*===装飾===*/
.fw{
	font-weight: bold;
}
.att{
	background: #f1e8e1;
	border-bottom: 1px dashed #ccc;
}
.point{
	color: #000;
	font-weight: bold;
}
mark, .mark{
	background: -moz-linear-gradient(transparent 70%, #fef9ae 70%);
	background: -webkit-linear-gradient(transparent 70%, #fef9ae 70%);
	background: -webkit-gradient(linear, 0 0, 0 100%, color-stop(0.70, transparent), color-stop(0.70, #fef9ae));
	background: linear-gradient(transparent 70%, #fef9ae 70%);
}
.att3 {
	background: #eea299;
	padding: 4px 14px 2px;
	margin: 5px 5px 10px 0;
	font-weight: bold;
	display: inline-block;
	color: #fff;
}
.att4 {
	background: #f1e8e1;
	padding: 10px 15px;
	display: block;
	border: 1px solid #999;
	box-shadow: 1px 1px 0 #fff inset;
	margin-top: 6px;
}
.att4 .point {
	color: #038dc7;
	font-size: 1.06em;
	font-weight: bold;
	text-shadow: 0 1px #fff;
}

/*===位置===*/
.btl{text-align:left;}
.btc{text-align:center;}
.btr{text-align:right;}

/*===色===*/
.fc-red{color:#df0101;}
.fc-orange{color:#f60;}
.fc-yellow{color:#fc0;}
.fc-lime{color:#9c3;}
.fc-green{color:#060;}
.fc-aqua{color:#20bbe0;}
.fc-teal{color:#099;}
.fc-blue{color:#039;}
.fc-navy{color:#006;}
.fc-purple{color:#639;}
.fc-fuchsia{color:#f36;}
.fc-pink{color:#eea299;}
.fc-maroon{color:#600;}
.fc-brown{color:#633;}
.fc-olive{color:#990;}
.fc-gray{color:#666;}
.fc-silver{color:#999;}
.fc-black{color:#000;}
.fc-white{color:#fff;}
.fc-kawabata{color:#eea299;}

/*===大きさ===*/
.fs-1{font-size:10px;}
.fs-2{font-size:12px;}
.fs-3{font-size:14px;}
.fs-4{font-size:16px;}
.fs-5{font-size:18px;}
.fs-6{font-size:20px;}
.fs-7{font-size:22px;}

/*===白フチ===*/
.outline-1{
  text-shadow: 
  #fff 1px 0px,  #fff -1px 0px,
  #fff 0px -1px, #fff 0px 1px,
  #fff 1px 1px , #fff -1px 1px,
  #fff 1px -1px, #fff -1px -1px,
  #fff 1px 1px,  #fff -1px 1px,
  #fff 1px -1px, #fff -1px -1px,
  #fff 1px 1px,  #fff -1px 1px,
  #fff 1px -1px, #fff -1px -1px;
}
.outline-2{
  text-shadow: 
  #fff 2px 0px,  #fff -2px 0px,
  #fff 0px -2px, #fff 0px 2px,
  #fff 2px 2px , #fff -2px 2px,
  #fff 2px -2px, #fff -2px -2px,
  #fff 1px 2px,  #fff -1px 2px,
  #fff 1px -2px, #fff -1px -2px,
  #fff 2px 1px,  #fff -2px 1px,
  #fff 2px -1px, #fff -2px -1px;
}

/*==========================================
 img-layout
===========================================*/
/*画像左レイアウト300px*/
.img_left{padding: 20px 0; overflow:hidden;}
.img_left img, .img_left .img_box{display:block; float:left; width:350px;}
.img_left .txt_box{ float:right; width:620px; line-height: 2;}
@media screen and (min-width: 0px) and (max-width:768px) {
.img_left img, .img_left .img_box{ float:none; width:100%; margin-bottom: 20px;}
.img_left .txt_box{float:none; width:100%;}
}
/*画像右レイアウト300px*/
.img_right{padding: 20px 0; overflow:hidden;}
.img_right img, img_right .img_box{display:block; float:right; width:350px;}
.img_right .txt_box{float:left; width:620px; line-height: 2;}
@media screen and (min-width: 0px) and (max-width:768px) {
.img_right img, img_right .img_box{float:none; width:100%; margin-bottom: 20px;}
.img_right .txt_box{float:none; width:100%;}
}
/*画像のみ表示*/
.img_only{display: block; width: 100%; padding: 0 0 20px 0; margin: 0 auto;}
.img_only img{width: 100%; max-width: 100%; height:auto; margin: 0 auto;}

/*画像左レイアウト200px*/
.img_left1{padding: 20px 0; overflow:hidden;}
.img_left1 img, .img_left1 .img_box{display:block; float:left; width:200px;}
.img_left1 .txt_box{ float:right; width:720px; line-height: 2;}
@media screen and (min-width: 0px) and (max-width:768px) {
.img_left1 img, .img_left1 .img_box{ float:none; width:100%; margin-bottom: 20px;}
.img_left1 .txt_box{float:none; width:100%;}
}
/*画像右レイアウト200px*/
.img_right1{padding: 20px 0; overflow:hidden;}
.img_right1 img, img_right1 .img_box{display:block; float:right; width:200px;}
.img_right1 .txt_box{float:left; width:720px; line-height: 2;}
@media screen and (min-width: 0px) and (max-width:768px) {
.img_right1 img, img_right1 .img_box{float:none; width:100%; margin-bottom: 20px;}
.img_right1 .txt_box{float:none; width:100%;}
}

/*==========================================
 list
===========================================*/
ul.list_type1{
	list-style-position: inside;
	list-style-type : disc;
	margin-left: 1em;
	padding-left: 5px;
	text-indent: -1.3em;
}
ul.list_type2{
	list-style-position: inside;
	list-style-type : decimal;
	margin-left: 1em;
	padding-left: 1em;
	text-indent: -1em;
}

/*==========================================
 table
===========================================*/
table{
	width: 100%;
	table-layout: fixed;
}
table th{
	background: #f7f7f7;
}
table th.left,
table td.left,
table th.center,
table td.center,
table th.right,
table td.right,
table tr.left,
table tr.center,
table tr.right,
table.left,
table.center,
table.right{
	float: inherit;
}
table th.center,
table td.center,
table tr.center,
table.center{
	margin: inherit;
	display: table-cell;
}
table tr.center{
	display: table-row;
}
table.center{
	display: table;
}
.t-l,
table.t-l th,
table.t-l td,
table tr.t-l th,
table tr.t-l td,
table th.t-l,
table td.t-l{
	text-align: left;
}
.t-c,
table.t-c th,
table.t-c td,
table tr.t-c th,
table tr.t-c td,
table th.t-c,
table td.t-c{
	text-align: center;
}
.t-r,
table.t-r th,
table.t-r td,
table tr.t-r th,
table tr.t-r td,
table th.t-r,
table td.t-r{
	text-align: right;
}
table.v-t th,
table.v-t td,
table tr.v-t th,
table tr.v-t td,
table th.v-t,
table td.v-t{
	vertical-align: top;
}
table tr.v-t img,
table th.v-t img,
table td.v-t img{
	display: inline-block;
	vertical-align: top;
}
table.v-m th,
table.v-m td,
table tr.v-m th,
table tr.v-m td,
table th.v-m,
table td.v-m{
	vertical-align: middle;
}
table tr.v-m img,
table th.v-m img,
table td.v-m img{
	display: inline-block;
	vertical-align: middle;
}
table.v-b th,
table.v-b td,
table tr.v-b th,
table tr.v-b td,
table th.v-b,
table td.v-b{
	vertical-align: bottom;
}
table tr.v-b img,
table th.v-b img,
table td.v-b img{
	display: inline-block;
	vertical-align: bottom;
}
table caption{
	font-size:1em;
	font-weight: bold;
	text-align: left;
}
table caption::before{
	content: "●";
	color: #000;
	margin-right: .3em;
}

/*===sp===*/
@media screen and (min-width: 0px) and (max-width:768px) {
table img{
	max-width: 50% !important;
}
/*col1*/
table.sp_col1 th{
	display: block;
	width: 100%;
}
table.sp_col1 td{
	display: block;
	border: 1px solid #ddd;
	border-top: none;
}
table.sp_col1 {
	border-collapse: separate;
	border-spacing: 0 10px;
}
}

/*==========================================
 link
===========================================*/
/*hover*/
@media screen and (min-width:768px) {
a {-webkit-transition: all .4s; transition: all .4s;}
.link_type1 a:hover{color: #eca298;}
.link_type1 a i{padding: .3em;}
a.fade:hover {opacity: .7; filter: alpha(opacity=70); -ms-filter: "alpha(opacity=70)"; -webkit-transition: all .4s; transition: all .4s;}
}
/*IE（アニメーション無効化）*/
@media all and (-ms-high-contrast:none) {
a {transition: none;}
a.fade {transition: none;}
a.fade:hover {transition: none;}
}

/*==========================================
 space
===========================================*/
/*margin*/
.mt0{margin-top: 0 !important;}.mr0{margin-right: 0 !important;}.mb0{margin-bottom: 0 !important;}.ml0{margin-left: 0 !important;}
.mt10{margin-top: 10px !important;}.mr10{margin-right:10px !important;}.mb10{margin-bottom: 10px !important;}.ml10{margin-left: 10px !important;}
.mt20{margin-top: 20px !important;}.mr20{margin-right:20px !important;}.mb20{margin-bottom: 20px !important;}.ml20{margin-left: 20px !important;}
.mt30{margin-top: 30px !important;}.mr30{margin-right:30px !important;}.mb30{margin-bottom: 30px !important;}.ml30{margin-left: 30px !important;}
.mt40{margin-top: 40px !important;}.mr40{margin-right:40px !important;}.mb40{margin-bottom: 40px !important;}.ml40{margin-left: 40px !important;}
.mt50{margin-top: 50px !important;}.mr50{margin-right:50px !important;}.mb50{margin-bottom: 50px !important;}.ml50{margin-left: 50px !important;}
.mt60{margin-top: 60px !important;}.mr60{margin-right:60px !important;}.mb60{margin-bottom: 60px !important;}.ml60{margin-left: 60px !important;}
.mt70{margin-top: 70px !important;}.mr70{margin-right:70px !important;}.mb70{margin-bottom: 70px !important;}.ml70{margin-left: 70px !important;}
.mt80{margin-top: 80px !important;}.mr80{margin-right:80px !important;}.mb80{margin-bottom: 80px !important;}.ml80{margin-left: 80px !important;}
.m-r1em{margin:0 1em 0 0;}.m-b1em{margin:0 0 1em 0;}.m-l1em{margin:0 0 0 1em;}.m-half{margin:0 0 .5em 0;}.m-lrhalf{margin:0 .5em;}.m-lr1em{margin:0 1em;}.m-b1ema{margin:0 auto 1em auto;}.m-0a{margin:0 auto;}

/*==========================================
 width
===========================================*/
.w100{width:100%;}.w90{width:90%;}.w85{width:85%;}.w80{width:80%;}.w75{width:75%;}.w70{width:70%;}.w60{width:60%;}.w50{width:50%;}.w40{width:40%;}.w35{width:35%;}.w30{width:30%;}.w25{width:25%;}.w20{width:20%;}.w15{width:15%;}.w10{width:10%;}

/*==========================================
 パンくず
===========================================*/
.breadcrumbs {
	width: 100%;
	max-width: 1000px;
	height: auto;
	font-size: 12px;
	margin: 0 auto 15px;
	overflow: hidden;
	color: #999;
}
.breadcrumbs li {
	float: left;
	padding-left: 5px;
}
.breadcrumbs a {
	color: #999;
	text-decoration: underline;
}
@media screen and (min-width: 0px) and (max-width:768px) {
.breadcrumbs {
	display: none;
}
}

/*==========================================
 Googleマップ
===========================================*/
.ggmap {
	position: relative;
    padding-top: 0;
    overflow: hidden;
    height: 460px;
    width: 1500px;
    float: right;
}
.ggmap iframe, .ggmapr object, .ggmap embed {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	padding-left: 0;
	padding-right: 0;
}
.ggmap_low {
	padding-top: 0;
	overflow: hidden;
	height: 400px;
	width: 350px;
	float: right;
	/*filter: grayscale(1);*/
}
.ggmap_low iframe, .ggmapr object, .ggmap_low embed {
	width: 100%;
}
#access .ggmap_low {
	padding-top: 0;
	margin-left: 20px;
	overflow: hidden;
	height: 370px;
	width: 470px;
	float: right;
}
@media screen and (min-width: 0px) and (max-width:768px) {
.ggmap {
	position: relative;
	padding-top: 0;
	height: 0;
	overflow: hidden;
	height: 350px;
	border-bottom: none;
}
.ggmap iframe, .ggmapr object, .ggmap embed {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 350px;
	padding-left: 0;
	padding-right: 0;
}
.ggmap_low {
	position: relative;
	padding-top: 0;
	overflow: hidden;
	height: 350px;
	border-bottom: none;
	width:100%;
	float: none;
}
.ggmap_low iframe, .ggmapr object, .ggmap_low embed {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 350px;
	padding-left: 0;
	padding-right: 0;
}
}

/*==========================================
 動画
===========================================*/
.movie_area{
	width: 850px;
	margin-left: auto;
	margin-right: auto;
}
.youtube_outer {
	width: 100%;
	padding-top: 50%;
	position: relative;
	top: 0;
	left: 0;
}
.youtube_outer iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100% !important;
	height: 100% !important;
}
@media screen and (min-width: 0px) and (max-width:767px) {
.movie_area{
	width: 90%;
}
}

/*==========================================
 関連ページリンク
===========================================*/
ul.page_linklist {
	width: 100%;
	margin: 0 auto;
}
ul.page_linklist li{
	vertical-align: top;
	margin-left: 1em;
	margin-bottom: 1%;
}
ul.page_linklist li ul li{
	display: inline-block;
}
ul.page_linklist li:nth-child(4n){
	margin-right: 0;
}
ul.page_linklist li a{
	color: #333;
	font-size: 14px;
	font-weight: bold !important;
	text-decoration: none;
}
ul.page_linklist li ul li a{
	display: inline-block;
	font-weight: normal !important;
}
ul.page_linklist li a:hover{
	color: #eca298;
}
ul.page_linklist li a i{
	font-size: 14px;
	margin-right: 3px;
}

/*===マーク===*/
/*第1階層*/
ul.page_linklist li::before{
	content:"●";
	color: #999;
	font-size: 12px;
	margin-right: 0.3em;
}
/*第2階層*/
ul.page_linklist li ul li::before{
	content:"●";
	color: #999;
	font-size: 10px;
	margin-right: 0.3em;
}

/*==========================================
 404ページ
===========================================*/
.box-notfound {
	width: 95%;
	max-width: 960px;
	font-size: 18px;
	line-height: 1.6;
	text-align: center;
	border: 1px dotted #666;
	padding: 40px 2%;
	margin: 100px auto;
}
.box-notfound span {
	display: block;
	line-height: 1.6;
	padding: 20px 0;
}
@media screen and (min-width: 0px) and (max-width:768px) {
.box-notfound {
	font-size: 14px;
}
}

.grecaptcha-badge {
 	visibility: hidden;
 }
.re_text {
 	text-align:center;
 	font-size:0.6rem;
 	color:#999;
	margin-bottom:10px;
 }
.re_text a{
 	color:#999;
}

/*==========================================
 アイキャッチh2
===========================================*/
.eyecatch-wrapper {
  position: relative;
  width: 100%;
  height: 300px; /* アイキャッチ画像と同じ高さに合わせる */
  overflow: hidden;
		margin-bottom: 15px;
}
.eyecatch-wrapper::before {
    background-color: #ccc;
    content: "";
    height: 100%;
    mix-blend-mode: multiply;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
}

.featured-img {
  width: 100%;
  height: 300px;
  object-fit: cover;
  display: block;
}

.eyecatch-wrapper .title {
   color: #ffffff;
    font-size: 35px;
    font-weight: bold;
    line-height: normal;
    padding-bottom: clamp(20px);
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
    width: 100%;
}
.eyecatch-wrapper .title::before {
    background-color: #ffffff;
    content: "";
    height: 2px;
    position: absolute;
    left: 50%;
    bottom: -10px;
    transform: translateX(-50%);
    width: clamp(60px, 7.81vw, 80px);
}
@media screen and (min-width: 0px) and (max-width:768px) {
.eyecatch-wrapper .title {
    font-size: 30px;
}
.eyecatch-wrapper .title::before {
	bottom: 0;
}
}