@CHARSET "UTF-8";

@import url('https://fonts.googleapis.com/css2?family=Jost:ital,wght@0,100..900;1,100..900&display=swap');
*{box-sizing:border-box;word-break:break-all; }

/* BACK IMAGE */
@media only screen and (min-width:768px){
	.back-img{ width:100%; height:300px; background-position:center; background-size:cover; }
	.back-img.back1{ background-image:url(../image/cpt-back.jpg); }
	.back-img.back2{ background-image:url(../image/srv-back.jpg); }
	.back-img img{ display:none; }
}
@media only screen and (min-width:1024px){
	.back-img{ height:580px; }
}

/* MV */
#mv{ padding:0 20px; background-position:center; background-size:cover; background-image:url(../image/main.jpg); }
.top_inner{ height:510px; max-width:1300px; margin:auto; position:relative; }
.top_msg{ position:absolute; top:50%; left:0; transform:translateY(-50%); -webkit-transform:translateY(-50%); -ms-transform:translateY(-50%); }
.top_msg .topttl{ margin:0 0 30px; }
.top_msg .topttl p{ font-size:46px; font-weight:normal; line-height:1; font-family:"Jost", sans-serif; }
.top_msg .topttl p::first-letter{ color:#2E5D50; }
.top_msg p{ font-weight:bold; }
.top_msg .dft-btn{ margin:25px 0 0; }
.top_msg .dft-btn a{ margin:0; background-color:transparent; }
.top_msg .dft-btn a:hover{ margin:0; background-color:rgba(255, 255, 255, 0.5); }
.top_form{ display:none; background-color:#FFF; border-radius:5px; color:#FFF; box-shadow:0 3px 6px 0 rgba(0,0,0,0.15); }
.top_form h2{ font-size:20px; margin:0 0 20px; text-align:center; justify-content:center; }
.top_form h2::before{ display:none; }
.top_form dl{ clear:both; margin:0 0 15px; }
.top_form dl:last-of-type{ margin:0; }
.top_form dl dt{ color:#000; font-size:15px; line-height:30px; display:block; }
.top_form dl dd{ display:block; }
.top_form form dl dd select,
.top_form form dl dd input{ padding:12px; width:100%; font-size:16px; border-radius:7px; border:1px solid #CECECE; background-color:#FCFAFA; transition:0.2s linear; }
.top_form form dl dd select:focus,
.top_form form dl dd input:focus{ border:1px solid #FFF; background-color:rgba(255, 255, 255, 1.0); }
.top_form form dl dd input[type="text"]::placeholder{ color:#A7A6A6; }
.top_form form .form_btn{ position:relative; margin:25px 0 0; }
.top_form form .form_btn::after{ position:absolute; content:""; display:block; width:25px; height:25px; right:25px; top:0; bottom:0; margin:auto; background-repeat:no-repeat; background-image:url(../other/form_arw1.svg); transition:0.3s; }
.top_form form .form_btn input{ display:block; margin-left:auto; border-radius:70px; margin-right:auto; width:100%; height:50px; font-size:18px; line-height:30px; border:2px solid #987B46; background-color:#987B46; text-align:center; color:#FFF; transition:0.2s linear; }
.top_form form .form_btn input:hover{ cursor:pointer; }
.top_form dl dd.name input[type="text"]{ width:135px; margin:0 10px 0 0; }
.top_form dl dd.name input[type="text"]:last-child{ margin:0; }
@media only screen and (min-width:768px){
	.top_inner{ height:650px; }
	.top_msg{ padding:0; }
	.top_msg .topttl{ margin:0 0 35px; }
	.top_msg .topttl p{ font-size:65px; }
	.top_msg .topttl p.txt2,
	.top_msg .topttl p.txt3{ display:inline-block; }
	.top_msg .topttl p.txt3{ padding:0 0 0 15px; }
	.top_msg p{ font-size:20px; }
	.top_msg .dft-btn{ margin:35px 0 0; }
	.top_form{ display:block; height:515px; width:330px; position:absolute; top:0; bottom:0; right:0; margin:auto; padding:30px 20px; }
	.top_form form dl dd select,
	.top_form form dl dd input{ padding:8px; }
}
@media screen and (min-width:1024px){
	.top_inner{ height:750px; }
	.top_msg .topttl{ margin:0 0 55px; }
	.top_msg .topttl p{ font-size:65px; }
	.top_msg .topttl p.txt3{ padding:0 0 0 30px; }
	.top_msg p{ font-size:22px; }
	.top_msg p br{ display:none; }
	.top_msg .dft-btn{ margin:55px 0 0; }
	.top_form{ height:550px; width:430px; padding:20px 45px 20px; }
	.top_form dl dd.name input[type="text"]{ width:160px; }
	.top_form form .form_btn input{ height:70px; }
}
@media screen and (min-width:1300px){
	.top_inner{ height:930px; }
	.top_msg .topttl p{ font-size:105px; }
}

/* CONCEPT */
#concept{ padding:45px 20px 50px; background-position:top left 20%; background-repeat:no-repeat; background-size:cover; background-image:url(../image/concept_back.png); }
.cpt-box{ margin:45px 0 0; }
.cpt-box h3{ text-align:center; font-size:22px; margin:0 0 45px; }
.cpt-txt p{ margin:0 0 30px; }
.cpt-txt p:last-child{ margin:0; }
.cpt-txt .pcbr{ display:none; }
@media only screen and (min-width:768px){
	#concept{ background-size:contain; }
	.cpt-box h3{ font-size:32px; text-align:left; }
	.cpt-txt p{ max-width:570px; margin:0 0 40px auto; }
	.cpt-txt p:last-child{ margin:0 0 0 auto; }
	.cpt-txt .pcbr{ display:block; }
}
@media only screen and (min-width:1024px){
	#concept{ padding:65px 20px 95px; }
	.cpt-box h3{ font-size:38px; text-align:left; }
	.cpt-txt p{ max-width:930px; margin:0 0 50px auto; }
}

/* WORKS */
#works{ padding:60px 20px 100px; }
#works .swiper{ margin:30px 0 0; }
#works .lib-media__item{ display:flex; }
#works .lib-media__txtarea{ order:1; padding:1rem 6px 0; }
#works .lib-media__title{ font-size:18px; margin:0 0 10px; order:1;}
#works .lib-media__category{ color:#2E5D50; background-color:transparent; border:none; font-size:16px; order:2; }
#works .lib-media__txt{ display:none; }
#works .lib-media__thumb{ order:2; }
#works .lib-card__thumb .thumb{ max-height:none; height:auto; display:block; padding:6px; }
#works .lib-media__thumb img{ height:auto; width:auto; width:100%; border-radius:10px; box-shadow:0 3px 6px 0 rgba(0,0,0,0.15); }
#works .lib-badge__category{ color:#FFF; background-color:#2E5D50; display:block;border:none; padding:5px 10px;margin:0;font-size:10px; width:110px; text-align:center; }
#works .clm-slide{ margin:50px 0 0; }
#works .lib-swiper__control{ display:none; }
#works .swiper-button{ max-width:150px; height:21px; margin:45px auto 0; position:relative; }
#works .swiper-button-next,
#works .swiper-button-prev{ width:21px; height:21px; color:transparent; background-position:center; background-size:contain; top:0; bottom:0; margin:auto; }
#works .swiper-button-next{ background-image:url(../other/right_slide.svg); right:0; }
#works .swiper-button-prev{ background-image:url(../other/left_slide.svg); left:0; }
#works .swiper-button-next:after,
#works .swiper-button-prev:after{ width:21px; height:21px; }
@media only screen and (min-width:768px){
	#works{ padding:65px 0 125px; }
	#works .inner{ padding:0 20px; }
	#works .swiper{ margin:40px 0 0; }
}
@media only screen and (min-width:1024px){
	#works{ padding:75px 0 145px; }
	#works .swiper{ margin:50px 0 0; }
}

/* VOICE */
#voice{ padding:60px 20px 55px; background:linear-gradient(0deg,rgba(211, 235, 234, 1) 10%, rgba(248, 251, 252, 1) 70%, rgba(232, 244, 248, 1) 95%); }
.voice-bale{ position:relative; padding:50px 35px; background:#FFF; border-radius:15px 0 0 15px; box-shadow:0 0 10px 0 rgba(46,93,80,0.1); }
.voice-sub{ position:relative; font-size:14px; color:#2E5D50; font-weight:bold; }
.voice-slide figure{ margin:0 0 5px; }
.voice-slide h3{ font-size:18px; margin:0 0 15px; }
.voice-slide p{ color:#908D8D; }
#voice .dft-btn a{ background-color:transparent; }
#voice .dft-btn a:hover{ margin:0; background-color:rgba(255, 255, 255, 0.5); }
#voice .swiper-button{ max-width:160px; height:21px; margin:45px auto 0; position:relative; }
#voice .swiper-button-next,
#voice .swiper-button-prev{ width:21px; height:21px; color:transparent; background-position:center; background-size:contain; top:0; bottom:0; margin:auto; }
#voice .swiper-button-next{ background-image:url(../other/right_slide.svg); right:0; }
#voice .swiper-button-prev{ background-image:url(../other/left_slide.svg); left:0; }
#voice .swiper-pagination{ width:55px; margin:auto; }
#voice .swiper-pagination-current { margin:0 10px 0 0; }
#voice .swiper-pagination-total { margin:0 0 0 10px; }
#voice .lib-media__item{ display:flex; }
#voice .lib-media__txtarea{ order:1; padding:1rem 6px 0; }
#voice .lib-media__title{ font-size:18px; }
#voice .lib-media__category{ color:#2E5D50; background-color:transparent; border:none; font-size:16px; order:2; }
#voice .lib-media__txt{ display:none; }
#voice .lib-media__thumb{ order:2; }
#voice .lib-card__thumb .thumb{ max-height:none; height:auto; display:block; padding:6px; }
#voice .lib-media__thumb img{ height:auto; width:auto; width:100%; border-radius:10px; box-shadow:0 3px 6px 0 rgba(0,0,0,0.15); }
#voice .lib-badge__category{ color:#FFF; background-color:#2E5D50; border:none; font-size:10px; padding:5px 10px; margin:0; display:block; width:110px; text-align:center; }
#voice .clm-slide{ margin:50px 0 0; }
#voice .lib-swiper__control{ display:none; }
@media only screen and (min-width:768px){
	#voice{ padding:80px 0 70px 20px; }
	.voice-bale::after{ content:''; position:absolute; top:0; bottom:0; right:-15%; margin:auto; width:100%; height:100%; background:#FFF; }
	#voice .inner{ margin:0 0 0 auto; }
	.voice-row{ display:flex; }
	.voice-bale{ padding:80px 50px; }
	#voice .swiper-button{ margin:60px 0 0 auto; }
}
@media only screen and (min-width:1024px){
	#voice{ padding:100px 0 90px 20px; }
	.voice-bale{ padding:100px 120px; }
	#voice .swiper-button{ margin:70px 0 0 auto; }
}
@media only screen and (min-width:1300px){
	#voice .inner{ margin:0 0 0 auto; max-width:98%; }
}
@media only screen and (min-width:1500px){
	#voice{ height:840px; padding:100px 0 0 100px; }
	#voice .inner{ max-width:1587px; aspect-ratio:653 / 838; }
}

/* SERVICE */
#service{ padding:35px 20px 40px; }
.srv-list{ margin:40px 0 0; }
.srv-box{ box-sizing:border-box; position:relative; display:flex; padding:15px 5px;border-bottom:1px solid #CDCDCD; flex-wrap:wrap; align-items:center; transition:0.3s; }
.srv-box:hover{ box-shadow:0 0 6px 0 rgba(0,0,0,0.16); }
.srv-box::after{ position:absolute; content:""; display:block; width:30px; height:30px; right:0; top:0; bottom:0; margin:auto; background-repeat:no-repeat; background-image:url(../other/btn_arw_hv.svg); }
.srv-box:hover::after{ background-image:url(../other/btn_arw.svg); }
.srv-box .srv-img{ width:40px; height:40px; margin:0 15px; background-repeat:no-repeat; background-size:contain; }
.srv-img.web{ background-image:url(../other/web1.svg); }
.srv-img.bow{ background-image:url(../other/search1.svg); }
.srv-img.chat{ background-image:url(../other/chat1.svg); }
.srv-img.ad{ background-image:url(../other/ad1.svg); }
.srv-img.write{ background-image:url(../other/write1.svg); }
.srv-img.movie{ background-image:url(../other/movie1.svg); }
.srv-img.promo{ background-image:url(../other/promo1.svg); }
.srv-box:hover .srv-img.web{ background-image:url(../other/web2.svg); }
.srv-box:hover .srv-img.bow{ background-image:url(../other/search2.svg); }
.srv-box:hover .srv-img.chat{ background-image:url(../other/chat2.svg); }
.srv-box:hover .srv-img.ad{ background-image:url(../other/ad2.svg); }
.srv-box:hover .srv-img.write{ background-image:url(../other/write2.svg); }
.srv-box:hover .srv-img.movie{ background-image:url(../other/movie2.svg); }
.srv-box:hover .srv-img.promo{ background-image:url(../other/promo2.svg); }
.srv-box span{ font-size:24px; }
.srv-txt h3{ margin:0; font-size:24px; line-height:1; font-weight:normal; font-family:"Jost", sans-serif; }
.srv-txt p{ color:#707070; line-height:1.6; margin:0; font-size:14px }
.srv-txt p.target{ position:relative;}
.srv-txt p.target:after{ font-family:icons !important; font-style:normal; font-weight:400; line-height:1; position:static; display:inline-block; vertical-align:middle; font-size:80%; margin:0.1em 0.3em 0; content:"\ea04"!important; }
.srv-rink{ position:absolute; height:100%; width:100%; left:0; }
.srv-rink:where(:where(a)[target=_blank]):after{ display:none; }
.srv-view{ display:none; }
.srv-box:hover span,
.srv-box:hover .srv-txt h3,
.srv-box:hover .srv-txt p{ color:#2F5D50; }
@media only screen and (min-width:768px){
	#service{ padding:60px 20px 65px; }
	.srv-txt{ display:flex; align-items:center; }
	.srv-list{ margin:45px 0 0; }
	.srv-box{ padding:15px 20px; }
	.srv-box span{ font-size:32px; }
	.srv-box .srv-img{ width:50px; height:50px; margin:0 50px 0 30px; }
	.srv-txt h3{ font-size:30px; width:135px; margin:0 60px 0 0; }
	.srv-txt p{ font-size:18px; }
	.srv-box::after{ right:20px; }
}
@media only screen and (min-width:1024px){
	#service{ padding:80px 20px 95px; }
	.srv-list{ margin:50px 0 0; }
	.srv-box span{ font-size:35px; }
	.srv-box .srv-img{ margin:0 75px 0 30px; }
	.srv-txt h3{ font-size:35px; width:155px; margin:0 135px 0 0; }
	.srv-txt p{ font-size:20px; }
}

/* NEWS */
#news{ padding:35px 20px 25px; }
#news .lib-rss__date{ font-size:16px; color:#908D8D; line-height:1; margin:0 0 15px; }
#news .lib-rss__title{ font-size:18px; font-weight:bold; line-height:1.5; color:#000; }
#news .lib-rss__list{ margin:20px 0 0; }
#news .lib-rss__list li{ padding:15px 5px; border-top:none; border-bottom:1px solid #D3D3D3; margin:0; cursor:pointer; transition:0.3s; }
#news .lib-rss__list li:hover{ box-shadow:0 0 6px 0 rgba(0,0,0,0.16); }
#news .lib-rss__contents{ display:none; }
@media only screen and (min-width:768px){
	#news{ padding:60px 20px 35px; }
	#news .lib-rss__list{ margin:30px 0 0; }
	#news .lib-rss__list li{ display:flex; align-items:center; padding:25px 15px; }
	#news .lib-rss__date{ margin:0 20px 0 0; }
	#news .lib-rss__title{ margin:0 0 0 20px; }
}
@media only screen and (min-width:1024px){
	#news{ padding:80px 20px 40px; }
}

/* COLUMN */
#column{ padding:40px 20px 30px; }
#column .clm-slide{ margin:35px 0 0; }
#column .lib-media__item{ display:flex; }
#column .lib-media__txtarea{ order:1; }
#column .lib-media__title{ font-size:18px;order:2; }
#column .lib-media__category{ color:#2E5D50; background-color:#FFF; border:none; font-size:16px; order:1; }
#column .lib-media__txt{ display:none; }
#column .lib-media__thumb{ order:2; }
#column .lib-card__thumb .thumb{ max-height:none; height:auto; display:block; }
#column .lib-media__thumb img{ height:auto; width:auto; width:100%; border-radius:10px; }
#column .lib-badge__category{ color:#FFF; background-color:#2E5D50; border:none; font-size:10px; display:block; width:110px; text-align:center; padding:5px 10px; margin:0 0 10px; }
#column .clm-slide{ margin:50px 0 0; }
#column .lib-swiper__control{ display:none; }
@media only screen and (min-width:768px){
	#column{ padding:35px 20px 65px; }
	#column .clm-slide{ margin:40px 0 0; }
}
@media only screen and (min-width:1024px){
	#column{ padding:40px 20px 70px; }
	#column .clm-slide{ margin:50px 0 0; }
}

/* DOCUMENT */
#document{ position:relative; padding:60px 20px 70px; background:#F5F5F5; border-radius:50px 0 0 0; }
#document .doc-slide{ margin:35px 0 0; }
#document .lib-media__item{ display:flex; }
#document .lib-media__txtarea{ order:1; }
#document .lib-media__title{ font-size:18px; }
#document .lib-media__txt{ font-size:16px }
#document .lib-media__thumb{ order:2; }
#document .lib-card__thumb .thumb{ max-height:none; height:auto; display:block; }
#document .lib-media__thumb img{ height:auto; width:auto; width:100%; border-radius:10px; }
#document .lib-badge__category{ display:none; }
#document .doc-slide{ margin:50px 0 0; padding:0 15px }
#document .lib-swiper__control{ display:none; }
#document .swiper-button-next:after,
#document .swiper-button-prev:after{ color:#000; }
#document .swiper-button-next:after,
#document .swiper-button-prev:after{ color:#000; }
#document .swiper-button-prev{ left:0; }
#document .swiper-button-next{ right:0; }
@media only screen and (min-width:768px){
	#document{ padding:60px 20px 20px; margin:0 auto 90px; }
	#document .doc-slide{ margin:40px 0 0; }
}
@media only screen and (min-width:1024px){
	#document{ margin:0 auto 125px; padding:65px 20px 20px; }
	#document .clm-slide{ margin:50px 0 0; }
}
@media only screen and (min-width:1400px){
	#document{ padding:65px 50px 20px; width:calc(100% - 100px); max-width:1400px; border-radius:26px; }
}

/* EXAMPLE */
#header.f-color{ background:transparent; }
.inner{ margin:auto; max-width:1300px; }
#contents{ max-width:none; padding:0; }
:where(h3):not([class]){ padding-bottom:0; border-bottom:none; margin-top:0; }