@charset "utf-8";

/* ==========================================================================
   Foundation
   ========================================================================== */
/* Reset
   ----------------------------------------------------------------- */

html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,figcaption,figure,footer,header,hgroup,main,menu,nav.gnav,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent;font-weight:500;}body{line-height:1}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav.gnav,section{display:block}ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:none}a{margin:0;padding:0;font-size:100%;vertical-align:baseline;background:transparent}del{text-decoration:line-through}abbr[title],dfn[title]{border-bottom:1px dotted;cursor:help}table{border-collapse:collapse;border-spacing:0}hr{display:block;height:1px;border:0;border-top:1px solid #ccc;margin:1em 0;padding:0}input,select{vertical-align:middle}
figure{margin-bottom:0;}
/* Base
   ----------------------------------------------------------------- */
body{
	font-family: 'Zen Kaku Gothic New', sans-serif;
	font-weight:500;
	color:#333333;
	font-feature-settings: "palt";/*文字詰め用*/
}
html {
  scroll-padding-top: 70px;
}
a{text-decoration:none;color:#333;}
a:hover{opacity:0.8;}
img{
	vertical-align:top;
	max-width:100%;
	height:auto;
}
ol{list-style:none}

/* ==========================================================================
   共通
========================================================================== */
html{font-size:16px;scroll-padding-top: 20px;}

/*文字寄せ*/
.txt-right{text-align:right;}
.txt-center{text-align:center;}
/*一文字空白*/
.indent{text-indent: 1em;}
/*URL改行防止*/
main p{word-break: break-all;}


/*mapレスポンシブ*/
.gmap {
height: 0;
overflow: hidden;
padding-bottom: 56.25%;
position: relative;
}
.gmap iframe {
position: absolute;
left: 0;
top: 0;
height: 100%;
width: 100%;
}

/*tel スマホサイズのみクリック可*/
@media screen and (min-width: 769px) {
a[href*="tel:"] {
pointer-events: none;
cursor: default;
text-decoration: none;
}
}

@media screen and (min-width: 769px) {.sp768{display:none;}}
@media screen and (min-width: 481px) {.sp480{display:none;}}

/*共通ボタン*/
.btn a{
	font-size:clamp(16px, 2vw, 24px);
	font-weight:bold;
	color:#fff;
	text-align:center;
	background:#6DC9C0;
	max-width:600px;
	box-sizing:border-box;
	line-height:45px;
	padding:1rem;
	display: block;
	margin:0 auto;
	border:solid 3px #6DC9C0;
	border-radius:40px;
}


.btn a:hover{
	opacity: 1;
	background:#fff;
	color:#6DC9C0;
}

@media screen and (max-width: 480px){
.btn a{

}
}

.link a{
	color:#464DA8;
	font-weight:bold;
}
.link a:after{
	content:"";
	display:inline-block;
	width:16px;
	height:14px;
	margin-top:2px;
	background-image:url(img/icon01.png);
	background-repeat:no-repeat;
	background-size:auto 100%;
	margin-left:10px;
	
}


/*動画レスポンシブ*/
.movie-wrap{
	position: relative;
	padding-bottom: 56.25%; /*アスペクト比 16:9の場合の縦幅*/
	height: 0;
	overflow: hidden;
	background:#ccc;
}
.movie-wrap iframe{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}


/* ==========================================================================
   Layout
========================================================================== */
/* Header
----------------------------------------------------------------- */

header{
	background-image:url(img/main-img.jpg);
	background-repeat:no-repeat;
	background-size:cover;
	background-position:center;
	height:60vh;
	padding:0;
}


.h-top{
	background:#50BB31;
	padding:.5rem 1rem;
	margin-bottom:2rem;
}
.h-top-in{
	max-width:1200px;
	margin:0 auto;
	display:flex;
	flex-wrap:wrap;
}
.h-top-in .shusai{
	font-size:clamp(13px, 2vw, 16px);
	font-weight:bold;
	color:#fff;
	flex:1;
}



#header-in{
	max-width:1200px;
	margin:0 auto;
	display:flex;
	flex-wrap:wrap;
	align-items:center;
	position:relative;
	padding:0 2rem;
}
#header-in .h-logo,
#header-in .h-logo img{
	width:100%;
	max-width:800px;
	height: 50vh;
	box-sizing: border-box;
}

.h_nav{
	display:flex;
	flex-wrap:wrap;
}
.h_nav li a{
	color:#fff;
	font-weight:bold;
}
.h_nav li:not(:last-child) a:after{
	content:"/";
	margin:0 0.5rem;
}
@media screen and (max-width: 768px){
	header{height:unset;padding-bottom:2rem;}
	#header-in .h-logo, #header-in .h-logo img{height:unset;}
}


/* main
---------------------------------------------------------------- */

main{
	background-image:url(img/bg.jpg);
	background-attachment: fixed;
  background-size: cover;
  background-position: center;

}

@media screen and (max-width: 1400px){

}


/* footer
---------------------------------------------------------------- */
footer{background-color:#8F7D62;padding:1rem;}
footer address{
	color:#fff;
	text-align:center;
	font-style:normal;
	font-size:clamp(12px, 1.6vw, 16px);
}
.f_inner{

}


/* ==========================================================================
   main
========================================================================== */


.sec{padding:6rem 4rem;}
@media screen and (max-width: 1400px){.sec{padding:4rem 3rem;}}
@media screen and (max-width: 480px){.sec{padding:2rem 1rem;}}
.inner{ 
	max-width:1200px;
	margin:0 auto;
}

/*見出し*/
h1,
h2,
h3,
h4,
h5{line-height:1.5em;font-weight:700;}
p{line-height:1.5em;font-weight:500;}

h1:not(.not){font-size:clamp(21px, 4vw, 32px);}
h2:not(.not){font-size:clamp(20px, 3.5vw, 28px);}
h3:not(.not){font-size:clamp(18px, 3vw, 24px);}
h4:not(.not){font-size:clamp(18px, 2.5vw, 21px);}
h5:not(.not){font-size:clamp(16px, 2vw, 18px);}
p,a{font-size:clamp(14px, 1.75vw, 16px);}

h1:not(.not),
h2:not(.not),
h3:not(.not),
h4:not(.not){
	font-weight:bold;
}
h2:not(.not){margin-bottom:2rem;}
h3:not(.not),
h4:not(.not),
p{margin-bottom:1rem;}

span{display:inline-block;font-weight:500;}

.col{
	display:flex;
	flex-wrap:wrap;
}
@media screen and (max-width: 768px){
.col{display:block;}
}

@media screen and (max-width: 1480px){

}
@media screen and (max-width: 480px){

}


/*ドットが歪んだ丸のリスト*/
ul.list01{
	margin-left: 0.5rem;
	margin-bottom:2rem;
}
ul.list01 > li{
	font-size:clamp(15px, 2vw, 18px);
	line-height: 2em;
	padding:0 0 0 26px;
	position:relative;
}
ul.list01 > li:before{
	content: "";
	position:absolute;
	left:4px;
	top:calc(0.5em + 5px);
	width:10px;
	height:10px;
	background:#333;
	display: block;
	border-radius: 41% 59% 48% 52% / 52% 50% 50% 48%;
}


/* ==========================================================================
   コンテンツ別
========================================================================== */

#index01 .col{align-items:flex-end;}
#index01 .tit h2 span{font-weight:bold;}
#index01 .col .item-txt{flex:1;}
#index01 .col .item-img{width:25%; margin-left:1rem;}
@media screen and (min-width: 1181px){
#index01 .col .item-txt p{font-size:clamp(16px, 2vw, 18px);}
}
@media screen and (max-width: 768px){
#index01 .col .item-img{margin-left:auto;width:150px;}
}

#index02 .inner{
	max-width:1000px;
	position:relative;
	display:flex;
	flex-wrap:wrap;
}
#index02 .item-txt{
	background-color:#F5EBCD;
	border-radius:20px;
		box-sizing:border-box;
		padding:2rem;
}
#index02 .item-img{
	
}

@media screen and (min-width: 769px){
#index02 .cont{
	width:calc(70% + 100px);
}
#index02 .item-txt{
	padding:2rem 120px 2rem 2rem;

}
#index02 .item-img{
	position:absolute;
	right:0;
	bottom:0;
	z-index:1;
	width:30%;
}
}
@media screen and (max-width: 768px){
	#index02 .item-txt{
		padding:2rem 2rem 100px 2rem;
	}
	#index02 .item-img{
	position:absolute;
	right:0;
	bottom:-2rem;
	z-index:1;
	width:35%;
}
}
@media screen and (max-width: 480px){
	#index02 .item-txt{padding:2rem 1rem 60px 1rem;}
	#index02 .item-img{width:140px;}
}


#index03 .inner{
	background:#fff;
	border-radius:20px;
	padding:4rem;
}
#index03 .inner .col{
	align-items:center;
}
#index03 .inner .item-txt{
	flex:1;
}
#index03 .inner .item-img{
	width:30%;
	margin-left:2rem;
}

@media screen and (max-width: 768px){
	#index03 .inner{padding:2rem;}
	#index03 .inner .item-img{margin-left:auto;}
}
@media screen and (max-width: 480px){
#index03 .inner{padding:2rem 1rem;}
#index03 .inner .item-img{width:200px;margin:0 auto;}
}


/*ラインナップ*/
#area-top{
	text-align:center;
}
#area-top p{font-size:clamp(16px, 3vw, 28px);font-weight:bold;}
#area-top p span{font-weight:bold;}
@media screen and (min-width: 481px){
	#area-top .sp{display:none;}
}
@media screen and (max-width: 480px){
	#area-top .pc{display:none;}
}


/*追従するバー*/
.linkbar{
	
}
.linkbar.fixed {
	opacity: 1;
	z-index: 9;
	position: fixed;
	left: 0;
	top: 0;
	transition: 0.3s;
	width:100%;
}


.area-nav{
	display:flex;
	flex-wrap:wrap;
}
.area-nav{max-width:1200px; margin:0 auto;}

.area-nav li{
	width:calc(100% / 7);
	padding:2px;
	box-sizing:border-box;
}
.area-nav li a{
	display:block;
	text-align:center;
	padding:1rem 0;
	color:#fff;
	font-weight:bold;
	font-size:clamp(13px, 1.5vw, 16px);
}
.area-nav li:nth-child(1) a{background-color:#C563A2;}
.area-nav li:nth-child(2) a{background-color:#8D3F94;}
.area-nav li:nth-child(3) a{background-color:#14327C;}
.area-nav li:nth-child(4) a{background-color:#06647D;}
.area-nav li:nth-child(5) a{background-color:#768234;}
.area-nav li:nth-child(6) a{background-color:#E89732;}
.area-nav li:nth-child(7) a{background-color:#C8AF39;}

@media screen and (min-width: 769px){
	.area-nav li a .sp{display:none;}
}
@media screen and (max-width: 768px){
	.area-nav li a .pc{display:none;}
	.area-nav li{padding:0;}
}


.area{padding:3rem 0;}
.area .tit{padding:0 1rem 0;margin-bottom:3rem;}
.area .tit h2{
	max-width:1200px;
	margin:0 auto;
}
.area .tit h2 span{
	font-size:clamp(20px, 3.5vw, 28px);
	font-weight:bold;
	padding:1em 1.5em;
	color:#fff;
}
.area .cont{
	max-width:1160px;
	margin:0 auto;
	padding:0 1rem ;
	box-sizing:border-box;
}
.area .cont .item{margin-bottom:3rem;}
.area .cont .in-tit{
	display:flex;
	flex-wrap:wrap;
	align-items:center;
	margin-bottom:1rem;
}
.area .cont .in-tit span{
	display:inline-block;
	width:70px;
	margin-right:1rem;
	box-sizing:border-box;
	font-size:clamp(21px, 4vw, 32px);
	font-weight:bold;
	color:#fff;
	padding:15px 0 15px 15px;
	clip-path: polygon(0% 0%, 100% 0%, 85% 50%, 100% 100%, 0% 100%);
	background:#ccc;
}
.area .cont .in-tit .special-num span{
	width:100px;
	padding:15px 0 25px 30px;
	position:relative;
}
.area .cont .in-tit .special-num span b{
	font-size:12px;
	position:absolute;
	left:15px;
	bottom:10px;
}

.area .cont .in-tit h3{flex:1;margin-bottom:0;}

.area .cont .in-cont{
	display:flex;
	flex-wrap:wrap;
}
.area .cont .in-cont .in-txt{
	flex:1;
}
.area .cont .in-cont .in-img{
	width:40%;
	max-width:370px;
	margin-left:2rem;
}


.area .cont ul{margin-bottom:1rem;}
.area .cont ul > li{
	display:inline-block;
}
.area .cont ul > li h4,
.area .cont ul > li p{
	display:inline-block;
	padding:2px 5px;
	margin-bottom:5px;
	line-height:1.25rem;
}
.area .cont ul > li h4{
	font-size:clamp(14px, 1.75vw, 16px);
	font-weight:500;
	margin-right:.5rem;
	background:#999999;
	color:#fff;
}
.area .cont ul > li p{margin-right:1rem;}

.area .cont h4.nittei-tit{
	background:#C8AF39;
	color:#fff;
	padding:2px 5px;
}
.area .cont h5.nittei-tit-sub span{
	background:#C8AF39;
	color:#fff;
	display:inline-block;
	padding:2px 5px;
}
.area .cont ul.nittei{border:solid 1px #C8AF39;padding:1rem;}
.area .cont ul.nittei > li{margin-bottom:.5rem;font-size:clamp(13px, 1.5vw, 14px);}
.area .cont ul.nittei > li img{width:30px;}
.area .cont ul.nittei > li:not(:last-child):not(.not):after{
	content:" ～ ";
}



#area01 .tit{border-bottom:solid 5px #C563A2;}
#area01 .tit span{background-color: #C563A2;}
#area01 .cont .in-tit span{background-color:#C563A2;}

#area02 .tit{border-bottom:solid 5px #8D3F94;}
#area02 .tit span{background-color: #8D3F94;}
#area02 .cont .in-tit span{background-color:#8D3F94;}

#area03 .tit{border-bottom:solid 5px #14327C;}
#area03 .tit span{background-color: #14327C;}
#area03 .cont .in-tit span{background-color:#14327C;}


#area04 .tit{border-bottom:solid 5px #06647D;}
#area04 .tit span{background-color: #06647D;}
#area04 .cont .in-tit span{background-color:#06647D;}

#area05 .tit{border-bottom:solid 5px #768234;}
#area05 .tit span{background-color: #768234;}
#area05 .cont .in-tit span{background-color:#768234;}

#area06 .tit{border-bottom:solid 5px #E89732;}
#area06 .tit span{background-color: #E89732;}
#area06 .cont .in-tit span{background-color:#E89732;}

#area07 .tit{border-bottom:solid 5px #C8AF39;}
#area07 .tit span{background-color: #C8AF39;}
#area07 .cont .in-tit span{background-color:#C8AF39;}


@media screen and (max-width: 768px){
	.area .cont .in-cont{
		flex-direction:column-reverse;
	}
	.area .cont .in-cont .in-img{
		width:unset;
		max-width:unset;
		margin:0 auto 2rem;
		text-align:center;
	}

}

@media screen and (max-width: 480px){
	.area .tit h2 span{padding:.5rem 1rem;}
	.area .cont .in-tit span{width:55px;margin-right:.5rem;}
	.area .cont .in-tit .special-num span{width:75px;padding:15px 0 25px 20px;}
	.area .cont .in-tit .special-num span b{left:5px;}
}






/*申し込み/連絡先*/
.area .contact{
	display:flex;
	flex-wrap:wrap;
	align-items: flex-end;
}
.area .contact .con-txt{
	flex:1;
}
.area .contact .con-txt h4{
	margin-bottom:0;
}
.area .contact .con-txt a:not(.tel){
	color:#2879fe;
}

.area .contact .qr{
	width:120px;
	margin-left:2rem;
}

@media screen and (max-width: 768px){
	.area .contact .qr{width:80px;}
}
@media screen and (max-width: 480px){
	.area .contact .qr{display:none;}
}

/*パンフレットはこちら*/
#pamphlet{max-width:680px;margin:0 auto;}
#pamphlet .inner{text-align:center;}
#pamphlet a{
	display:inline-block;
}


/*全体に関するお問い合わせ*/
#all-contact h3{
	background:#8F7D62;
	color:#fff;
	padding:1rem;
	margin-bottom:3rem;
}
@media screen and (min-width: 769px){
#all-contact .col .item{
	width:calc((100% - 2rem) / 2);
}
#all-contact .col .item:nth-child(2n){margin-right:2rem;}
}

/*アイコン*/
ul.icon-list{
	text-align:center;
}
ul.icon-list li{
	display:inline-block;
	padding:0 1rem;
}
ul.icon-list li a{
	display:inline-block;
}
