@charset "UTF-8";
/*------------------------------------------------------------------*/
/* header */
/*------------------------------------------------------------------*/
header { width: 100%; position: relative; box-sizing: border-box; }

header.fixed { position: fixed; z-index: 9999; background-color: rgba(255, 255, 255, 0.8); }
@media screen and (max-width: 60.06em) { header.fixed { position: relative; } }

@media screen and (max-width: 60.06em) { header #gnav { position: fixed; top: 0; left: 0; z-index: 9998; } }

/* menu-btn sp */
#menu-btns { display: none; }
@media screen and (max-width: 60.06em) { #menu-btns { display: block; position: fixed; top: calc(20/750*100vw); right: calc(20/750*100vw); cursor: pointer; background-color: #343434; line-height: 1.25 !important; z-index: 9999; width: calc(80/750*100vw); height: calc(80/750*100vw); border-radius: 50%; padding: 3.0666666667vw 2.5333333333vw 3.0666666667vw 2.5333333333vw; box-sizing: border-box; } }

.top-menu-trigger, .menu-trigger { z-index: 10; }

.top-menu-trigger, .top-menu-trigger span, .menu-trigger, .menu-trigger span { display: inline-block; transition: all 0.3s; box-sizing: border-box; }

.top-menu-trigger, .menu-trigger { position: relative; width: calc(42/750*100vw); height: calc(34/750*100vw); }

.top-menu-trigger span, .menu-trigger span { position: absolute; width: 100%; height: calc(6/750*100vw); background-color: #ffffff; }

.menu-trigger span:nth-of-type(1), .menu-trigger span:nth-of-type(1) { top: 0; }

.top-menu-trigger span:nth-of-type(2), .menu-trigger span:nth-of-type(2) { top: calc(14/750*100vw); }

.top-menu-trigger span:nth-of-type(3), .menu-trigger span:nth-of-type(3) { bottom: 0; }

.top-menu-trigger.active span:nth-of-type(1), .menu-trigger.active span:nth-of-type(1) { -webkit-transform: translateY(calc(14/750*100vw)) rotate(-45deg); transform: translateY(calc(14/750*100vw)) rotate(-45deg); }

.top-menu-trigger.active span:nth-of-type(2), .menu-trigger.active span:nth-of-type(2) { opacity: 0; }

.top-menu-trigger.active span:nth-of-type(3), .menu-trigger.active span:nth-of-type(3) { -webkit-transform: translateY(calc(-14/750*100vw)) rotate(45deg); transform: translateY(calc(-14/750*100vw)) rotate(45deg); }

/* nav */
#gnav { max-width: 1200px; margin: 0 auto; display: block; }
@media screen and (max-width: 60.06em) { #gnav { display: none; z-index: 9998; position: fixed; width: 100%; top: 0; left: 0; right: 0; bottom: 0; overflow-y: auto; margin-top: 0; background-color: rgba(0, 0, 0, 0.9); padding: 0; } }

#nav_area ul { width: 100%; display: flex; justify-content: space-between; padding: 99px 0 41px; }
@media screen and (max-width: 60.06em) { #nav_area ul { display: block; padding: 0; } }

header.fixed #nav_area ul { padding: 19px 0 20px; }
@media screen and (max-width: 60.06em) { header.fixed #nav_area ul { padding: 0; } }

#nav_area li { font-size: 20px; font-weight: 500; text-align: center; }
@media screen and (max-width: 60.06em) { #nav_area li { font-size: calc(40/750*100vw); } }

#nav_area li a { display: block; padding: 0; color: #343434; box-sizing: border-box; }
@media screen and (max-width: 60.06em) { #nav_area li a { color: #fff; padding: 3.7333333333vw 2.6666666667vw 3.3333333333vw 2.6666666667vw; border-bottom: calc(2/750*100vw) solid #666666; } }

#nav_area li:last-child a { border-bottom: 0; }

/*------------------------------------------------------------------*/
/* footer */
/*------------------------------------------------------------------*/
footer { padding: 158px 0 72px; }
@media screen and (max-width: 60.06em) { footer { padding: 14.6666666667vw 0vw 9.7333333333vw 0vw; } }

#copyright { text-align: center; font-size: 20px; }
@media screen and (max-width: 60.06em) { #copyright { font-size: calc(18/750*100vw); } }

.pagetop { display: none; position: fixed; bottom: 20px; right: 20px; width: 50px; height: 50px; z-index: 9999; }

.pagetop a { width: 50px; height: 50px; display: block; position: relative; background-color: #343434; border-radius: 50%; }

.pagetop a:hover { transition: all 0.3s; opacity: 0.8; }

.pagetop a .arrow { position: absolute; top: 22px; left: 18px; width: 8px; height: 8px; border: 3px solid #ffffff; border-color: #ffffff transparent transparent #ffffff; transform: rotate(45deg); }

/*------------------------------------------------------------------*/
/* common */
/*------------------------------------------------------------------*/
* { padding: 0; margin: 0; }

html, body { width: 100%; }

html { -webkit-text-size-adjust: 100%; font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif"; font-size: 62.5%; /* 10px */ line-height: 2; letter-spacing: 0.2em; font-weight: 500; color: #343434; }

ul, li { list-style: none; padding: 0; margin: 0; }

.relative_area { position: relative; }

body, li, ol, p, select { letter-spacing: 0.2em; font-size: 14px; }
@media screen and (max-width: 60.06em) { body, li, ol, p, select { font-size: calc(24/750*100vw); } }

input, textarea { letter-spacing: 0.2em; font-size: 14px; }
@media screen and (max-width: 60.06em) { input, textarea { font-size: calc(24/750*100vw); } }

body { background-color: #ffffff; }

img { display: block; border: 0; }

a { text-decoration: none; color: #999999; transition: all 0.3s; }

a:hover { text-decoration: none; transition: all 0.3s; }

a img:hover { opacity: 0.9; transition: all 0.3s; }

#wrapper { width: 100%; position: relative; }

#container { position: relative; width: 100%; }

.pcbr, .pcimg { display: block; }
@media screen and (max-width: 60.06em) { .pcbr, .pcimg { display: none; } }

.spbr, .spimg { display: none; }
@media screen and (max-width: 60.06em) { .spbr, .spimg { display: block; } }

/*------------------------------------------------------------------*/
/* top */
/*------------------------------------------------------------------*/
#front_page #container { padding-bottom: 100px; }
@media screen and (max-width: 60.06em) { #front_page #container { padding-bottom: calc(80/750*100vw); } }

.cbox { width: 1200px; margin: 0 auto; box-sizing: border-box; }
@media screen and (max-width: 75.06em) { .cbox { width: 100%; padding: 0 30px 0; } }
@media screen and (max-width: 60.06em) { .cbox { padding: 0vw 4vw 0vw 4vw; } }

/* slick */
.sliderArea { display: block; overflow: hidden; width: 100%; position: relative; line-height: 0; }

.sliderArea .slick-slide img { width: 100%; height: auto; display: block; }

.sliderArea .slick-dots { width: auto !important; bottom: 22px !important; right: 18px !important; }
@media screen and (max-width: 60.06em) { .sliderArea .slick-dots { bottom: calc(20/750*100vw) !important; right: calc(15/750*100vw) !important; } }

.sliderArea .slick-dots li, #details_slider .slick-dots li { width: 10px; height: 10px; margin: 0 6px; }
@media screen and (max-width: 60.06em) { .sliderArea .slick-dots li, #details_slider .slick-dots li { width: calc(20/750*100vw); height: calc(20/750*100vw); margin: 0vw 1.2vw 0vw 1.2vw; } }

.sliderArea .slick-dots li.slick-active button:before, #details_slider .slick-dots li.slick-active button:before { opacity: 1 !important; color: #343434 !important; }

.sliderArea .slick-dots li button::before, #details_slider .slick-dots li button::before { opacity: 1 !important; color: #f5f5f5 !important; font-size: 14px !important; width: 10px; height: 10px; padding: 0; }
@media screen and (max-width: 60.06em) { .sliderArea .slick-dots li button::before, #details_slider .slick-dots li button::before { width: calc(20/750*100vw); height: calc(20/750*100vw); font-size: calc(20/750*100vw) !important; } }

.sliderArea .slick-dots li button, #details_slider .slick-dots li button { width: 10px; height: 10px; padding: 0; }
@media screen and (max-width: 60.06em) { .sliderArea .slick-dots li button, #details_slider .slick-dots li button { width: calc(20/750*100vw); height: calc(20/750*100vw); } }

.sliderArea .slick-dotted.slick-slider { margin-bottom: 0 !important; }

.slider_pcimg { display: block !important; }
@media screen and (max-width: 60.06em) { .slider_pcimg { display: none !important; } }

.slider_spimg { display: none !important; }
@media screen and (max-width: 60.06em) { .slider_spimg { display: block !important; } }

/*--------------------------------------*/
/* introduction */
/*--------------------------------------*/
#introduction .cbox_inner { padding: 128px 0 0; }
@media screen and (max-width: 60.06em) { #introduction .cbox_inner { padding: 10.6666666667vw 0vw 0vw 0vw; } }

.leaf_img { margin: 0 auto; }
@media screen and (max-width: 60.06em) { .leaf_img { max-width: 80vw; } }

#introduction h3 { font-size: 30px; font-weight: 400; text-align: center; margin-top: 88px; }
@media screen and (max-width: 60.06em) { #introduction h3 { font-size: calc(36/750*100vw); margin-top: calc(36/750*100vw); } }

/*--------------------------------------*/
/* philosophy */
/*--------------------------------------*/
#philosophy .cbox_inner { padding: 150px 0 0; }
@media screen and (max-width: 60.06em) { #philosophy .cbox_inner { padding: 13.0666666667vw 0vw 0vw 0vw; } }

.heading_area .en { font-size: 20px; line-height: 1.2; text-align: center; margin-bottom: 13px; }
@media screen and (max-width: 60.06em) { .heading_area .en { font-size: calc(22/750*100vw); margin-bottom: calc(8/750*100vw); } }

.heading_area h4 { font-size: 60px; line-height: 1.2; text-align: center; }
@media screen and (max-width: 60.06em) { .heading_area h4 { font-size: calc(68/750*100vw); } }

.philosophy_box { border: 1px solid #3a7c9e; max-width: 1100px; margin: 104px auto 0; box-sizing: border-box; padding: 40px 0 40px 138px; }
@media screen and (max-width: 75.06em) { .philosophy_box { padding: 40px 0 40px 60px; } }
@media screen and (max-width: 60.06em) { .philosophy_box { width: 100%; border: calc(2/750*100vw) solid #3a7c9e; padding: 1.3333333333vw 2.6666666667vw 5.4666666667vw 2.6666666667vw; margin-top: calc(51/750*100vw); } }

.philosophy_box h5 { color: #3a7c9e; font-size: 50px; line-height: 1.76; }
@media screen and (max-width: 60.06em) { .philosophy_box h5 { font-size: calc(60/750*100vw); text-align: center; line-height: 1.7; margin-top: calc(18/750*100vw); } }

.philosophy_box h5 span { display: inline-block; color: #343434; font-size: 25px; padding-left: 66px; font-weight: 400; vertical-align: middle; margin-top: -7px; }
@media screen and (max-width: 60.06em) { .philosophy_box h5 span { display: block; font-size: calc(24/750*100vw); padding-left: 0; margin-top: 0; } }

/*--------------------------------------*/
/* message */
/*--------------------------------------*/
#message .cbox_inner { padding: 192px 0 0; }
@media screen and (max-width: 60.06em) { #message .cbox_inner { padding: 15.6vw 0vw 0vw 0vw; } }

.message_box { position: relative; margin-top: 38px; }
@media screen and (max-width: 60.06em) { .message_box { margin-top: calc(51/750*100vw); } }

.message_box img { padding-top: 30px; }
@media screen and (max-width: 75.06em) { .message_box img { width: calc(762/1200*100vw); } }
@media screen and (max-width: 60.06em) { .message_box img { width: 100%; max-width: 100%; padding-top: 0; } }

.message_textbox { position: absolute; top: 0; right: 60px; z-index: 10; }
@media screen and (max-width: 75.06em) { .message_textbox { right: calc(60/1200*100vw); } }
@media screen and (max-width: 60.06em) { .message_textbox { position: static; margin-top: calc(48/750*100vw); } }

.message_textbox p { font-size: 15px; line-height: 2.67; }
@media screen and (max-width: 75.06em) { .message_textbox p { font-size: calc(15/1200*100vw); } }
@media screen and (max-width: 60.06em) { .message_textbox p { font-size: calc(24/750*100vw); line-height: 2; } }

/*--------------------------------------*/
/* company */
/*--------------------------------------*/
#company .cbox_inner { padding: 206px 0 0; }
@media screen and (max-width: 60.06em) { #company .cbox_inner { padding: 13.8666666667vw 0vw 0vw 0vw; } }

.company_text { padding: 75px 0 0 108px; }
@media screen and (max-width: 75.06em) { .company_text { padding: 75px 30px 0 30px; } }
@media screen and (max-width: 60.06em) { .company_text { padding: 5.2vw 0vw 0vw 0vw; } }

.company_text p { font-size: 20px; line-height: 2.5; }
@media screen and (max-width: 60.06em) { .company_text p { font-size: calc(24/750*100vw); line-height: 2; } }

/*--------------------------------------*/
/* history */
/*--------------------------------------*/
#history .cbox_inner { padding: 87px 0 0; }
@media screen and (max-width: 60.06em) { #history .cbox_inner { padding: 14.1333333333vw 0vw 0vw 0vw; } }

.history_list { margin: 128px 0 0 89px; border-left: 6px solid #3a7c9f; }
@media screen and (max-width: 75.06em) { .history_list { margin: 128px 0 0 30px; } }
@media screen and (max-width: 60.06em) { .history_list { margin: 6.6666666667vw 0vw 0vw 0vw; border-left: calc(6/750*100vw) solid #3a7c9f; } }

.history_list dl { display: flex; margin-bottom: 30px; }
@media screen and (max-width: 60.06em) { .history_list dl { margin-bottom: calc(30/750*100vw); } }

.history_list dl:last-of-type { margin-bottom: 0; }

.year { background-color: #3a7c9e; width: 150px; padding: 34px 0; }
@media screen and (max-width: 60.06em) { .year { width: 16vw; padding: 4.5333333333vw 0vw 4.5333333333vw 0vw; } }

.year img { margin: 0 auto; }
@media screen and (max-width: 60.06em) { .year img { max-width: 11.2vw; } }

.history_list dd { padding-left: 30px; }

.history_list dd p { font-size: 22px; line-height: 1.8; margin-top: -8px; }
@media screen and (max-width: 60.06em) { .history_list dd p { font-size: calc(23/750*100vw); margin-top: calc(-10/750*100vw); } }

/*--------------------------------------*/
/* store_list */
/*--------------------------------------*/
#store_list .cbox_inner { padding: 215px 0 0; }
@media screen and (max-width: 60.06em) { #store_list .cbox_inner { padding: 15.6vw 0vw 0vw 0vw; } }

.store_info { display: flex; align-items: center; margin-left: 106px; }
@media screen and (max-width: 75.06em) { .store_info { margin-left: 30px; } }
@media screen and (max-width: 60.06em) { .store_info { display: block; margin: 0; } }

@media screen and (max-width: 60.06em) { .store_img { width: 100%; margin: 0 auto; } }

.store_img img { width: 100%; }

.store_body { padding-left: 110px; }
@media screen and (max-width: 75.06em) { .store_body { padding-left: 60px; } }
@media screen and (max-width: 60.06em) { .store_body { padding: 2.6666666667vw 0vw 0vw 0vw; } }

.store_body h5 { font-size: 30px; margin-bottom: 14px; }
@media screen and (max-width: 60.06em) { .store_body h5 { text-align: center; font-size: calc(40/750*100vw); margin-bottom: calc(8/750*100vw); } }

.store_text p { font-size: 15px; margin-bottom: 30px; }
@media screen and (max-width: 60.06em) { .store_text p { font-size: calc(24/750*100vw); margin-bottom: calc(15/750*100vw); } }

.store_text p:last-of-type { margin-bottom: 0; }

#nakano { margin-top: 184px; }
@media screen and (max-width: 60.06em) { #nakano { margin-top: calc(51/750*100vw); } }

#ageo { margin-top: 110px; }
@media screen and (max-width: 60.06em) { #ageo { margin-top: calc(47/750*100vw); } }

/* recruit */
.recruit { padding: 197px 0 0; }
@media screen and (max-width: 60.06em) { .recruit { padding: 14.1333333333vw 4vw 0vw 4vw; } }

.recruit img { margin: 0 auto; }
@media screen and (max-width: 60.06em) { .recruit img { max-width: 100%; } }

/*--------------------------------------*/
/* website */
/*--------------------------------------*/
#website { padding: 0; }

#website .cbox_inner { background-image: url("../../images/front/web_bg.jpg"); background-repeat: no-repeat; background-position: top center; margin-top: 215px; padding: 152px 0 328px; }
@media screen and (max-width: 60.06em) { #website .cbox_inner { background-size: cover; margin-top: calc(120/750*100vw); padding: 9.2vw 4vw 10.6666666667vw 4vw; } }

#website .heading_area h4 { color: #fff; font-weight: 400; }

.web_banner { width: 642px; margin: 0 auto; padding-top: 12px; }
@media screen and (max-width: 60.06em) { .web_banner { width: 85.6vw; padding-top: calc(7/750*100vw); } }

.web_banner li { margin-top: 53px; }
@media screen and (max-width: 60.06em) { .web_banner li { margin-top: calc(47/750*100vw); } }

.web_banner li p { font-size: 18px; color: #fff; margin-bottom: 4px; }
@media screen and (max-width: 60.06em) { .web_banner li p { font-size: calc(24/750*100vw); margin-bottom: calc(6/750*100vw); } }

.web_banner li img { width: 100%; }

/*--------------------------------------*/
/* sdgs */
/*--------------------------------------*/
#sdgs .cbox_inner { padding: 264px 0 0; }
@media screen and (max-width: 60.06em) { #sdgs .cbox_inner { padding: 14.8vw 0vw 0vw 0vw; } }

.sdgs_box1 { margin-top: 113px; }
@media screen and (max-width: 60.06em) { .sdgs_box1 { margin-top: calc(113/750*100vw); } }

.sdgs_img1 { width: 640px; margin: 0 auto; }
@media screen and (max-width: 75.06em) { .sdgs_img1 { max-width: 100%; } }
@media screen and (max-width: 60.06em) { .sdgs_img1 { width: 70%; } }

.sdgs_box1 p { text-align: center; font-size: 20px; line-height: 1.4; margin-top: 43px; }
@media screen and (max-width: 60.06em) { .sdgs_box1 p { font-size: calc(24/750*100vw); margin-top: calc(35/750*100vw); } }

.sdgs_message { padding-top: 95px; }
@media screen and (max-width: 60.06em) { .sdgs_message { padding-top: calc(27/750*100vw); } }

.sdgs_message p { text-align: center; font-size: 20px; margin-top: 40px; }
@media screen and (max-width: 60.06em) { .sdgs_message p { font-size: calc(24/750*100vw); margin-top: calc(35/750*100vw); text-align: left; } }

.sdgs_goals { margin: 266px auto 0; }
@media screen and (max-width: 75.06em) { .sdgs_goals { max-width: 100%; } }
@media screen and (max-width: 60.06em) { .sdgs_goals { margin-top: calc(66/750*100vw); } }

.sdgs_attack { max-width: 1062px; margin: 225px auto 0; border: 1px solid #333333; box-sizing: border-box; padding: 91px 0 92px; }
@media screen and (max-width: 75.06em) { .sdgs_attack { width: 100%; padding: 91px 30px 92px; } }
@media screen and (max-width: 60.06em) { .sdgs_attack { margin-top: calc(80/750*100vw); border: calc(2/750*100vw) solid #333333; padding: 3.7333333333vw 4vw 3.7333333333vw 4vw; } }

.sdgs_attack p { text-align: center; font-size: 20px; }
@media screen and (max-width: 60.06em) { .sdgs_attack p { font-size: calc(24/750*100vw); text-align: left; } }

.sdgs_no { display: flex; justify-content: center; margin-top: 193px; }
@media screen and (max-width: 60.06em) { .sdgs_no { margin-top: calc(80/750*100vw); } }

.sdgs_no li { width: 294px; margin-right: 88px; }
@media screen and (max-width: 60.06em) { .sdgs_no li { width: 30%; margin-right: 5%; } }

.sdgs_no li:last-child { margin-right: 0; }

.sdgs_no li img { max-width: 100%; }

.sdgs_no_detail { padding-top: 133px; }
@media screen and (max-width: 60.06em) { .sdgs_no_detail { padding-top: calc(32/750*100vw); } }

.sdgs_no_text { margin-top: 31px; }
@media screen and (max-width: 60.06em) { .sdgs_no_text { margin-top: calc(29/750*100vw); } }

.sdgs_no_text h5 { font-size: 40px; font-weight: 500; margin-bottom: 7px; }
@media screen and (max-width: 60.06em) { .sdgs_no_text h5 { font-size: calc(36/750*100vw); margin-bottom: calc(10/750*100vw); } }

.sdgs_no_text p { font-size: 20px; }
@media screen and (max-width: 60.06em) { .sdgs_no_text p { font-size: calc(24/750*100vw); } }

#sdgs_no3 h5 { color: #1b973a; }

#sdgs_no5 h5 { color: #e83418; }

#sdgs_no8 h5 { color: #970a31; }

/*--------------------------------------*/
/* contact */
/*--------------------------------------*/
#contact .cbox_inner { padding: 314px 0 0; }
@media screen and (max-width: 60.06em) { #contact .cbox_inner { padding: 13.8666666667vw 0vw 0vw 0vw; } }

.contact_lits { width: 674px; margin: 90px auto 0; }
@media screen and (max-width: 60.06em) { .contact_lits { width: 100%; margin-top: calc(70/750*100vw); } }

.contact_lits li { width: 100%; }

.contact_lits li img { max-width: 100%; }

/*--------------------------------------*/
/* sns */
/*--------------------------------------*/
#sns .cbox_inner { padding: 191px 0 0; }
@media screen and (max-width: 60.06em) { #sns .cbox_inner { padding: 14.6666666667vw 0vw 0vw 0vw; } }

.sns_links { display: flex; justify-content: center; margin-top: 84px; }
@media screen and (max-width: 60.06em) { .sns_links { margin-top: calc(68/750*100vw); } }

.sns_links li { margin-right: 48px; }
@media screen and (max-width: 60.06em) { .sns_links li { margin-right: calc(40/750*100vw); } }
.sns_links li img { max-width: 100%; }

.sns_links li:last-child { margin-right: 0; }