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

body { font-size:calc(18 * 0.2vw); }
:target { scroll-margin-top: calc(110vw / 7.2); }


.fs12vw { font-size:calc(12 * 0.21vw); }
.fs14vw { font-size:calc(14 * 0.2vw); }
.fs15vw { font-size:calc(15 * 0.2vw); }
.fs16vw { font-size:calc(16 * 0.2vw); }
.fs17vw { font-size:calc(17 * 0.2vw); }
.fs18vw { font-size:calc(18 * 0.2vw); }
.fs20vw { font-size:calc(20 * 0.2vw); }
.fs21vw { font-size:calc(21 * 0.19vw); }
.fs22vw { font-size:calc(22 * 0.18vw); }
.fs23vw { font-size:calc(23 * 0.18vw); }
.fs24vw { font-size:calc(24 * 0.17vw); }
.fs25vw { font-size:calc(25 * 0.17vw); }
.fs26vw { font-size:calc(26 * 0.17vw); }
.fs27vw { font-size:calc(27 * 0.17vw); }
.fs28vw { font-size:calc(28 * 0.17vw); }
.fs29vw { font-size:calc(29 * 0.17vw); }
.fs30vw { font-size:calc(30 * 0.17vw); }
.fs31vw { font-size:calc(31 * 0.17vw); }
.fs32vw { font-size:calc(32 * 0.15vw); }
.fs33vw { font-size:calc(33 * 0.15vw); }
.fs34vw { font-size:calc(34 * 0.15vw); }
.fs35vw { font-size:calc(35 * 0.14vw); }
.fs36vw { font-size:calc(36 * 0.14vw); }
.fs37vw { font-size:calc(37 * 0.14vw); }
.fs38vw { font-size:calc(38 * 0.14vw); }
.fs40vw { font-size:calc(40 * 0.12vw); }
.fs42vw { font-size:calc(42 * 0.12vw); }
.fs45vw { font-size:calc(45 * 0.12vw); }
.fs46vw { font-size:calc(46 * 0.12vw); }
.fs48vw { font-size:calc(48 * 0.12vw); }
.fs50vw { font-size:calc(50 * 0.12vw); }
.fs52vw { font-size:calc(52 * 0.12vw); }
.fs53vw { font-size:calc(53 * 0.12vw); }
.fs54vw { font-size:calc(54 * 0.12vw); }
.fs55vw { font-size:calc(55 * 0.12vw); }
.fs56vw { font-size:calc(56 * 0.12vw); }
.fs60vw { font-size:calc(60 * 0.12vw); }
.fs62vw { font-size:calc(62 * 0.12vw); }
.fs64vw { font-size:calc(64 * 0.12vw); }
.fs65vw { font-size:calc(65 * 0.12vw); }
.fs66vw { font-size:calc(66 * 0.12vw); }
.fs68vw { font-size:calc(68 * 0.12vw); }
.fs70vw { font-size:calc(70 * 0.1vw); }
.fs72vw { font-size:calc(72 * 0.1vw); }
.fs80vw { font-size:calc(80 * 0.08vw); }
.fs84vw { font-size:calc(84 * 0.08vw); }
.fs86vw { font-size:calc(86 * 0.08vw); }
.fs100vw { font-size:calc(100 * 0.07vw); }
.fs110vw { font-size:calc(100 * 0.07vw); }
.fs120vw { font-size:calc(120 * 0.07vw); }


.pc { display: none; }
.sp { display: unset; }
.sp_left { text-align:left; }

.more { width: 60vw; height: 13vw; line-height: 13vw; margin: 2em auto 2em auto; }
.more i { right: 4.5vw; line-height: 13vw;}
.more.center {  margin: 2em auto 2em auto;}

.bottom_contact .inner .email_btn { width: 60vw; height: 13vw; line-height: 13vw; margin: 2.5em auto 2em auto; }


.inner { width: 90%; max-width: unset; }
.middle_inner { width: 90%; max-width: unset; }
.inner_right { width: 90%; max-width: unset; margin-right:auto; margin-left:auto; }
.inner_left { width: 90%; max-width: unset; margin-right:auto; margin-left:auto; }

.low_inner { width: 90%; max-width: unset; }




.ttl { padding: 0 0 0 0; }







main { padding-top: calc(110vw / 7.2); }

#header { height: calc(110vw / 7.2); padding: 0.65em 0 0.65em 0; }
#header .inner { width:94%; }

#header .logo { width: calc(515vw / 6.8); line-height: 1; margin: 0.2em 0 0.2em 0; }
#header .logo .logo_mark { width: calc(86vw / 10.2); }



#header #hamburger { background: none; margin-block-start: 0.8em; z-index: 9999; }
#header #hamburger .bar {
	display: block; width: calc(60vw / 6.2); height: 2px;
	transition: transform 0.3s ease, opacity 0.3s ease;transform-origin: center center; transform: none;
}


#header #hamburger .bar_1 { margin-block-end:calc(15.25vw / 6.2); }


#header #hamburger.active .bar_1 { transform: translateY(var(--offset)) rotate(45deg); }
#header #hamburger.active .bar_2 { transform: translateY(calc(var(--offset) * -1)) rotate(-45deg); }


#header .header_nav.right { float:none; }



#header #drawer {
	position: fixed;top: 0;left: 0;width: 100%; height: 100%; display: flex; opacity:0;transition: opacity 0.3s ease; pointer-events:none;
	justify-content: flex-start; align-items: flex-start; z-index: 1000;
}
#header #drawer.open {opacity:1; pointer-events:auto;}

#header #drawer .drawer_content {width: 100%;height: 100%;transform: translateX(200%);transition: transform 0.3s ease; padding: 7em 5em 7em 5em; grid-template-rows: 20em; background-color:#FFFFFF; }
#header #drawer.open .drawer_content {transform: translateX(0);}

#header .header_nav ul.flex { display:block; }

#header .header_nav ul .page { margin:2em 0 2em 0; }
#header .header_nav ul .page a { font-size:calc(40 * 0.15vw); }

#header .header_nav ul .contact a { margin:2em 0 1em 0; width: 100%; height: calc(70vw / 5.2); font-size:calc(40 * 0.15vw); }
#header .header_nav ul .contact a i { font-size:calc(42 * 0.15vw); }

.bottom_contact { padding: 4em 0 3em 0; }
.bottom_contact .bottom_contact_wrapper { display:block; }

.bottom_contact .text { width: 100%; }
.bottom_contact .btn_box { width: 100%; }
.bottom_contact .btn_box .btn { height: calc(100vw / 7.2); }


#footer .inner.flex { display:block; }
#footer .site_info { width: 100%; }

#footer .site_info .logo { width: calc(515vw / 6.5); line-height: 1; margin: 0 0 2em 0; }
#footer .site_info .logo .logo_mark { width: calc(86vw / 7.2); }




#footer .footer_nav { width: 100%; }
#footer .footer_nav ul.flex { display:block; }
#footer .footer_nav ul.flex li { margin:0.5em 0 1.5em 0; }
#footer .footer_nav ul.section li { margin:0.5em 0 0.5em 0; }
#footer .copy { padding: 4em 0 2em 0; }






#fv { height: calc(830vw / 8.6); overflow:hidden; }
#fv .fv_inner { width: 94%; margin: 0 auto auto auto; }
#fv .text .slug { margin: 6.25em auto 0 auto; line-height: 1.2; }
#fv .text .catch { margin: 0 auto; }

#fv .slide { width: calc(1100vw / 12.2); height: calc(733vw / 12.2); }

#fv .slide.passive { inset: 1.25em 1.5em auto auto; }
#fv .slide.disable { inset: 1.25em 1.5em auto auto; }





#top_topics { padding: 4em 0 4em 0; }
#top_topics .top_topics_wrapper { display:block; }
#top_topics .top_topics_header { width: 100%; }
#top_topics .content { width: 100%; padding: 0; }

#top_topics .ttl { margin-block-end:0.5em; }


#top_service { padding: 4em 0 1em 0; }
#top_service .content { display:block; }
#top_service .box { width: 100%; margin-block-end: 4em; }



#top_company { padding: 4em 0 4em 0; }
#top_company .top_company_wrapper { display: block; }
#top_company .text { width:100%; }
#top_company .thumb { width: calc(512vw / 7.2); height: calc(512vw / 7.2); margin: 6em auto 2em auto; }




/* =========================================================
   下層ページ共通
========================================================= */

/* ページヘッダー */
.page_header { height: calc(480vw / 10.2); aspect-ratio: auto; }
.page_header_ttl::after { width: calc(80vw / 7.2); }




/* dl.table はSPで縦積み */
dl.table { display:block; }
dl.table dt, dl.table dd { display:block; width:100%; }



/* =========================================================
   事業内容
========================================================= */
.service_sec .thumb { width:100%; float:none; margin-block-end: 2em; }
.service_sec .text { width:100%; float:none; }

.service_sec .thumb .cover { border-radius: calc(10vw / 7.2); }

.service_sec .text .lead { margin: 1.5em 0 2em 0; }

.service_sec .results .results_ttl { margin: 0 0 1em 0; }
.service_sec .results { border-radius: calc(10vw / 7.2); padding: 1em; }
.service_sec .results dt { height: auto; padding: 0.5em; border-radius: calc(5vw / 7.2); }
.service_sec .results dd { margin: 0; padding: 0.5em 0 1.5em 0; }


.service_sec .service_logo { width: calc(400vw / 7.2); }
.service_sec .service_logo.logo_l { inset: -7.5em auto auto 1em; margin: auto; }
.service_sec .service_logo.logo_r { inset: auto 1em -7.5em auto; margin: auto; }


#writing { padding: 4em 0 10em 0; }
#media { padding: 10em 0 10em 0; }
#community { padding: 10em 0 4em 0; }



/* =========================================================
   会社案内
========================================================= */
/* 会社概要 */

#greeting { padding: 4em 0 4em 0; }

.company_sec .greeting_thumb { float:none; width: calc(470vw / 7.2); margin: 2em auto 4em auto; }
.company_sec .greeting_thumb::after { left: calc(-64vw / 7.2); bottom: calc(-50vw / 7.2); width: calc(496vw / 7.2); height: calc(366vw / 7.2); }
.company_sec .greeting_thumb .cover { border-radius: calc(10vw / 7.2); }
.company_sec .greeting_sign { margin: 2em 0 0 0; }

.company_sec .ttl { margin: 0 0 2em 0; }

#profile { padding: 4em 0 4em 0; }

.company_sec .profile_card { border-radius: calc(10vw / 7.2); padding: 1em 1em 1.75em 1em }

.company_sec .profile_card .table dt { width: 100%; border-bottom: solid 1px #601F07; padding: 0.5em 0 0.5em 0; }
.company_sec .profile_card .table dd { padding: 0.75em 0 1.5em 0; }
.company_sec .profile_card .table::after { display:none; }

#privacy { padding: 4em 0 4em 0; }







/* =========================================================
   お問い合わせ
========================================================= */

#contact { padding: 3em 0 4em 0; }

#contact .ttl { margin-bottom: 2em; }

.contact_sec .form_card { border-radius: calc(10vw / 7.2); padding: 1em 1em 2em 1em; }

#contact .box dt { width: 100%; padding: 0.5em 0 0.5em 0; border-bottom: solid 1px #601F07; }
#contact .box dd { padding: 0.75em 0 1.5em 0; }
#contact .box dd textarea { height: 14em; }

.contact_sec .form_row::after { display:none; }



.contact_sec .form_row dd input, .contact_sec .form_row dd textarea { width: 100%; border-radius: calc(5vw / 7.2); height: auto; padding: 0.5em; }

.contact_sec .form_btn, .contact_sec .back_btn { gap: calc(10vw / 7.2); width: calc(300vw / 7.2); height: calc(70vw / 7.2); }



.contact_sec .form_row dt .required,
.contact_sec .form_row dt .any { width: 3em; height: 1.5em; margin-right: calc(18vw / 7.2); border-radius: calc(5vw / 7.2); }