@charset "UTF-8";

.animated{animation-duration: 1.5s;}
sub{font-size: 70%;margin: 0 0.2em;}

/* メイン */
#wor_main{height: 90vh;width: 100%;display: flex;align-items: center;justify-content: center;}
#wor_main h2{text-align: center;font-family: 'Sawarabi Mincho', sans-serif;}
#wor_main h2 p:nth-of-type(1){font-size: 25px;letter-spacing: 0.2em;animation-name: fadeIn;animation-duration: 3s;animation-delay: 0.2s;animation-fill-mode: forwards;opacity: 0;}
#wor_main h2 p:nth-of-type(2){font-size: 16px;margin-top: 15px;letter-spacing: 0em;animation-name: fadeIn;animation-delay: 1.2s;animation-duration: 3s;animation-fill-mode: forwards;opacity: 0;}

@media screen and (max-width: 768px) {
#wor_main h2 p:nth-of-type(1){font-size: 5vw;}
#wor_main h2 p:nth-of-type(2){font-size: 3vw;margin-top: 2.5vw;}
}



/* メイン下写真＆リード */
#wor_main_bottom .main_bottom_img{max-width: 670px;margin: 0 auto;position: relative;}
#wor_main_bottom .main_bottom_img .main_bottom_img01{animation-name: fadeIn;}
#wor_main_bottom .main_bottom_img .main_bottom_img02{position: absolute;top:30%;right: 0;animation-name: fadeIn;animation-delay: 1s;}
#wor_main_bottom .main_bottom_img .main_bottom_img03{margin: 50px 0 0 50px;animation-name: fadeIn;animation-delay: 1s;}

#wor_main_bottom .main_bottom_lead{margin-top: 180px;display: flex;flex-direction: column;justify-content: center;align-items: center;}
#wor_main_bottom .main_bottom_lead p{line-height: 1.9;font-size: 17px;animation-name: fadeInUp;}
#wor_main_bottom .main_bottom_lead p:nth-of-type(n+2){margin-top: 40px;}
#wor_main_bottom .main_bottom_lead p:nth-of-type(3){animation-delay: 0.4s;}


@media screen and (max-width: 768px) {
#wor_main_bottom .main_bottom_img{padding: 0 20px;}
#wor_main_bottom .main_bottom_img .main_bottom_img01{width: 65%;}
#wor_main_bottom .main_bottom_img .main_bottom_img02{position: absolute;top:38%;right: 20px;width: 35%;}
#wor_main_bottom .main_bottom_img .main_bottom_img03{margin: 5% 0 0 5%;width: 50%;}

#wor_main_bottom .main_bottom_lead{margin-top: 100px;padding: 0 20px;display: block;}
#wor_main_bottom .main_bottom_lead p{font-size: 3.8vw;}
#wor_main_bottom .main_bottom_lead p:nth-of-type(n+2){margin-top: 7vw;}
}


/* ゆびわ言葉 */
.yubiwakotoba{max-width: 1260px;margin: 0 auto;padding: 0 30px; position: relative;}
.yubiwakotoba h3 img{/* writing-mode: vertical-rl;font-size: 24px;font-family: 'Sawarabi Mincho', sans-serif;letter-spacing: 0.4em; */width:25px;z-index: 1;}
.yubiwakotoba dl{display: flex;}
.yubiwakotoba dl > dt{width: 51.75%;animation-name: fadeInUp;}
.yubiwakotoba dl > dd{width: 48.25%;font-size: 16px;line-height: 2.2;font-family: 'Sawarabi Mincho', sans-serif;display: flex;justify-content: center;align-items: center;flex-direction: column;}
.yubiwakotoba h3{animation-name: fadeInUp;}
.yubiwakotoba p{animation-name: fadeIn;animation-delay: 1s;}
#shiawase{margin-top: 390px}
#shiawase h3{top:-150px;left: 8%;position: absolute;}
#tomoni{margin-top: 150px}
#tomoni h3{top:-30px;right: 11%;position: absolute;}
#kimisae{margin-top: 150px}
#kimisae h3{font-size: 24px;font-family: 'Sawarabi Mincho', sans-serif;letter-spacing: 0.4em;}
#kioku{margin-top: 150px}
#kioku dd div{display: flex;}
#kioku h3{width: 25px;order: 2;}
#kioku img{width: 100%;}
#kioku p{width: 120px;margin-right: 50px;}

@media screen and (max-width: 768px) {
.yubiwakotoba{padding: 0 20px;}
.yubiwakotoba h3 img{width:6vw;}
.yubiwakotoba dl{flex-wrap: wrap;}
.yubiwakotoba dl > dt{width: 100%;animation-delay: 0.1s;}
.yubiwakotoba dl > dd{width: 100%;font-size: 3.7vw;margin-top: 6.5vw;align-items: flex-start;}
.yubiwakotoba p{animation-delay: 0.3s;}
#shiawase{margin-top: 180px}
#shiawase h3{top:auto;bottom: -16vw;left: 6%;}
#shiawase dd{padding-left: 15vw;}
#tomoni{margin-top: 140px}
#tomoni h3{top:-16vw;right: 13%;}
#tomoni dd{order: 2;}
#kimisae{margin-top: 100px}
#kimisae h3{font-size: 6vw;font-family: 'Sawarabi Mincho', sans-serif;letter-spacing: 0.1em;position: absolute;right: 0;bottom: -4vw;}
#kimisae dd{position: relative;}
#kioku{margin-top: 100px}
#kioku dd{order: 2;align-items: center;position: relative;z-index: 2;margin-top: 10vw}
#kioku h3{width: 100%;font-size: 6vw;font-family: 'Sawarabi Mincho', sans-serif;letter-spacing: 0.1em;position: absolute;right: 0;text-align: center; bottom: -4vw;}
#kioku img{width: 100%;}
#kioku p{width: 18vw;margin-right: 0;}
}


/* PICKUP */
#wor_pickup{max-width: 1260px;margin: 150px auto 0;border-top: 1px solid #aaa;padding: 150px 30px 0;}
#wor_pickup h3{text-align: center;font-size: 30px;font-family: 'Sawarabi Mincho', sans-serif;animation-name: fadeInUp;}
#wor_pickup h3 p{font-size: 20px;margin-top: 10px;letter-spacing: 0.2em;}
#wor_pickup .pickup_item{display: flex;justify-content: space-between;flex-wrap: wrap; margin-top: 150px;}
#wor_pickup .pickup_item dt{width: 23.9%;cursor: pointer;position: relative;animation-name: fadeInUp;}
#wor_pickup .pickup_item dt.pickup02{animation-delay: 0.3s;}
#wor_pickup .pickup_item dt.pickup03{animation-delay: 0.6s;}
#wor_pickup .pickup_item dt.pickup04{animation-delay: 0.9s;}
#wor_pickup .pickup_item dt figure{overflow: hidden;position: relative;}
#wor_pickup .pickup_item dt img{transition: 0.4s all;}
#wor_pickup .pickup_item dt:hover img{transform: scale(1.1);}
#wor_pickup .pickup_item dt figcaption{color: #fff;line-height: 2;text-align: center;width: 100%;position: absolute;top:50%;transform: translateY(-50%);font-size: 16px;}
#wor_pickup .pickup_item dt.active::after{content: "";width: 0;height: 0;border-style: solid;border-width: 21px 11.5px 0 11.5px;border-color: #595757 transparent transparent transparent;position: absolute;bottom:-21px;margin: 0 auto;left:0;right: 0;display: block;}
#wor_pickup .pickup_item dd{display: none;line-height: 3;border: 1px solid #555;background: linear-gradient(to right,#fff,#F2ECEC);margin-top: 25px;width: 100%;}
#wor_pickup .pickup_item dd .retail_wrap{padding: 30px 60px;column-count: 4;}
#wor_pickup .pickup_item dd a{text-decoration: underline;font-family: 'Sawarabi Mincho', sans-serif;}
#wor_pickup .pickup_item dd a:hover{text-decoration: none;}

@media screen and (max-width: 768px) {
#wor_pickup{margin: 100px 20px 0;border-top: 1px solid #aaa;padding: 80px 0 0;}
#wor_pickup h3{font-size: 20px;}
#wor_pickup h3 p{font-size: 15px;margin-top: 7px;}
#wor_pickup .pickup_item{margin-top: 80px;}
#wor_pickup .pickup_item dt{width: 100%;cursor: pointer;position: relative;animation-name: fadeInUp;}
#wor_pickup .pickup_item dt.pickup02{animation-delay: 0s;}
#wor_pickup .pickup_item dt.pickup03{animation-delay: 0s;}
#wor_pickup .pickup_item dt.pickup04{animation-delay: 0s;}
#wor_pickup .pickup_item dt:nth-of-type(n+2){margin-top: 10px;}
#wor_pickup .pickup_item dt:hover img{transform: scale(1);}
#wor_pickup .pickup_item dt figcaption{font-size: 15px;}
#wor_pickup .pickup_item dt.active::after{display: none;}
#wor_pickup .pickup_item dt::before{content: "＋";position: absolute;right: 3%;top: 50%;transform: translateY(-50%);color: #fff;z-index: 1;font-weight: bold;font-size: 18px;}
#wor_pickup .pickup_item dt.active::before{content: "―";}
#wor_pickup .pickup_item dd{display: none;margin-top: 0;width: 100%;}
#wor_pickup .pickup_item dd .retail_wrap{padding: 20px 20px 10px;column-count: 2;}
#wor_pickup .pickup_item dd .close_wrap{text-align: center;padding: 10px 0 20px;}
#wor_pickup .pickup_item dd .close_wrap .close_btn{display: inline-block;border-bottom: 1px solid #555;padding-bottom: 3px;line-height: 2.1;text-decoration: none;}
#wor_pickup .pickup_item dd a{font-size: 13px;}
#wor_pickup .pickup_item dt.pickup01{order: 1;}
#wor_pickup .pickup_item dd.pickup_retail01{order: 2;}
#wor_pickup .pickup_item dt.pickup02{order: 3;}
#wor_pickup .pickup_item dd.pickup_retail02{order: 4;}
#wor_pickup .pickup_item dt.pickup03{order: 5;}
#wor_pickup .pickup_item dd.pickup_retail03{order: 6;}
#wor_pickup .pickup_item dt.pickup04{order: 7;}
#wor_pickup .pickup_item dd.pickup_retail04{order: 8;}
}


/* 誓約書 */
#wor_seiyakusyo{max-width: 1260px;margin: 150px auto 0;padding: 0 30px;}
#wor_seiyakusyo .seiyakusyo_item{display: flex;justify-content: space-between;align-items: center;}
#wor_seiyakusyo .seiyakusyo_item dt{width: 46%;animation-name: fadeInUp;}
#wor_seiyakusyo .seiyakusyo_item dt h3{font-size: 22px;font-family: 'Sawarabi Mincho', sans-serif;letter-spacing: 0.1em;}
#wor_seiyakusyo .seiyakusyo_item dt p{line-height: 2;font-size: 15px;margin-top: 10px;}
#wor_seiyakusyo .seiyakusyo_item dd{width: 50%;animation-name: fadeInUp;animation-delay: 0.3s;}

@media screen and (max-width: 768px) {
#wor_seiyakusyo{margin: 100px auto 0;padding: 0;}
#wor_seiyakusyo .seiyakusyo_item{flex-wrap: wrap;}
#wor_seiyakusyo .seiyakusyo_item dt{width: 100%;margin-top: 20px;order: 2;padding: 0 20px;}
#wor_seiyakusyo .seiyakusyo_item dt h3{font-size: 18px;text-align: center;}
#wor_seiyakusyo .seiyakusyo_item dt p{font-size: 13px;margin-top: 15px;line-height: 1.7;}
#wor_seiyakusyo .seiyakusyo_item dd{width: 100%; animation-delay: 0s;order: 1;}
}


/* CUSTOMER’S VOICE */
#customers_voice{background: #EFEFEF;}
#customers_voice .customers_voice_wrap{max-width: 1260px;margin: 150px auto 0;padding: 120px 20px;}
#customers_voice h3{text-align: center;letter-spacing: 0.2em;animation-name: fadeInUp;font-size: 16px;font-family: 'Sawarabi Mincho', sans-serif;}
#customers_voice h3 strong{font-size: 24px;display: block;letter-spacing: 0;margin-bottom: 5px;}
#customers_voice .customers_slider{margin-top: 100px;animation-name: fadeInUp;}
#customers_voice .customers_slider .slick-track li{background: #fff;padding: 40px 15px 50px;margin: 0 10px;}
#customers_voice .customers_slider .slick-track li:last-of-type{margin-right: 0;}
#customers_voice .customers_slider .slick-track li h4{font-size: 22px;font-family: 'Sawarabi Mincho', sans-serif;}
#customers_voice .customers_slider .slick-track li p{margin-top: 12px;line-height: 2.4;}
.slick-track {display: flex;}
.slick-slide {height: auto !important;}

@media screen and (max-width: 768px) {
#customers_voice .customers_voice_wrap{margin: 100px auto 0;padding: 80px 0;}
#customers_voice h3{font-size: 14px;}
#customers_voice h3 strong{font-size: 20px;margin-bottom: 5px;}
#customers_voice .customers_slider{margin-top: 70px;}
#customers_voice .customers_slider .slick-track li{background: #fff;padding: 30px 25px 30px;margin: 0 5px;}
#customers_voice .customers_slider .slick-track li:last-of-type{margin-right: 0;}
#customers_voice .customers_slider .slick-track li h4{font-size: 18px;text-align: center;}
#customers_voice .customers_slider .slick-track li p{margin-top: 10px;line-height: 1.8;font-size: 13px;}
.slick-dots{bottom: -50px;}
.slick-dots li{width: 12px;}
.slick-dots li button{background: #aaa;border-radius: 50%;width: 6px;height: 6px;padding: 0;}
.slick-dots li.slick-active button{background: #222;}
.slick-dots li button::before{display: none;}
}



.contact_bk .contact_wrap > h3{text-align: center;letter-spacing: 0.2em;animation-name: fadeInUp;font-size: 16px;font-family: 'Sawarabi Mincho', sans-serif;}
.contact_bk .contact_wrap > h3 strong{font-size: 24px;display: block;letter-spacing: 0;margin-bottom: 5px;}
.contact_bk .contact_wrap > h3 + p{margin-top: 50px;text-align: center;line-height: 2.4;animation-name: fadeInUp;}

@media screen and (max-width: 768px) {
.contact_bk .contact_wrap > h3{font-size: 14px;}
.contact_bk .contact_wrap > h3 strong{font-size: 20px;margin-bottom: 5px;}
.contact_bk .contact_wrap > h3 + p{margin-top: 30px;font-size: 13px;text-align: left;line-height: 1.7;}
}