@charset "UTF-8"; /* [S] wrap-major-sns */ #multipleContentsDiv_dept_687, #multipleContentsDiv_dept_1748, #multipleContentsDiv_dept_2118, #multipleContentsDiv_dept_2668, #multipleContentsDiv_dept_3258, #multipleContentsDiv_dept_3049, #multipleContentsDiv_dept_3070, #multipleContentsDiv_dept_3091, #multipleContentsDiv_dept_3112, #multipleContentsDiv_dept_3133, #multipleContentsDiv_dept_3177, #multipleContentsDiv_dept_3201, #multipleContentsDiv_dept_3226, #multipleContentsDiv_dept_3249, #multipleContentsDiv_dept_3279, #multipleContentsDiv_dept_3300, #multipleContentsDiv_dept_3321, #multipleContentsDiv_dept_3355, #multipleContentsDiv_dept_3414, #multipleContentsDiv_dept_3449, #multipleContentsDiv_dept_3504, #multipleContentsDiv_dept_3532, #multipleContentsDiv_dept_3588, #multipleContentsDiv_dept_3610, #multipleContentsDiv_dept_3874, #multipleContentsDiv_dept_4415, #multipleContentsDiv_dept_4804, #multipleContentsDiv_dept_5300, #multipleContentsDiv_dept_5557, #multipleContentsDiv_dept_6075, #multipleContentsDiv_dept_6264, #multipleContentsDiv_dept_6712, #multipleContentsDiv_dept_7009, #multipleContentsDiv_dept_7252, #multipleContentsDiv_dept_7739, #multipleContentsDiv_dept_7987, #multipleContentsDiv_dept_8300, #multipleContentsDiv_dept_8382, #multipleContentsDiv_dept_13840, #multipleContentsDiv_dept_14015 {display: flex;position: relative; padding:10.4rem 15rem 11.2rem 16rem; overflow: hidden;background:url(../images/bg-major-sns-pc.jpg) no-repeat left top / cover;} .wrap-major-sns .title {width: 55rem;padding-top: 7rem;padding-left: 1rem;flex-shrink: 0;opacity: 0;} .wrap-major-sns h2 {position: relative;margin-bottom: 4.5rem;font-family: sm; font-size: 4.5rem; color:#fff;line-height: 6rem;} .wrap-major-sns h2::before {content: '';position: absolute;left: 23rem;top: -22.5rem;width: 26.1rem;height: 24.3rem;background: url(../images/img-major-sns-deco.png) no-repeat center / contain;} .wrap-major-sns h2 span {color:#D5FF79; margin-right: 6rem; display: inline-block; position: relative; } .wrap-major-sns h2 span::after {content:''; width:5rem; height: 6.3rem; background:url(../images/img-title-obj3.png) no-repeat center; position: absolute; left:100%;top:-3rem;} .wrap-major-sns .controls {position: relative; display: flex; align-items: center;} .wrap-major-sns .prevnext {position: relative; margin-right: 3.4rem;} .wrap-major-sns .prevnext button { text-indent: -9999px; width: 4.3rem; height:3.4rem; transition: background .3s;} .wrap-major-sns .prevnext .prev {background:url(../images/btn-prev.png) no-repeat center / 3.3rem 2.7rem; margin-right: .2rem; position: relative;} .wrap-major-sns .prevnext .prev::before {content:''; width: 0.3rem; height:0.3rem; background:#b2b2b2; border-radius:50%; position: absolute; right:-.8rem; top:50%; margin-top:-0.2rem;} .wrap-major-sns .prevnext .prev:hover {background:url(../images/btn-prev-on.png) no-repeat center / 3.3rem 2.7rem;} .wrap-major-sns .prevnext .next {background:url(../images/btn-next.png) no-repeat center / 3.3rem 2.7rem; margin-left: 1rem;} .wrap-major-sns .prevnext .next:hover {background:url(../images/btn-next-on.png) no-repeat center / 3.3rem 2.7rem;} .wrap-major-sns .slider-box {width: 104rem;overflow:hidden;transform: translateX(4rem);opacity: 0;} .wrap-major-sns .con {flex: 1;} .wrap-major-sns li a {position: relative; display: block;} .wrap-major-sns li:hover::after {width:100%;} .wrap-major-sns .img-box { position: relative; width: 50rem;height: 31.5rem;padding-top: 1.5rem;margin-bottom: 2rem;} .wrap-major-sns .img-box img {width: 100%;height: 100%;object-fit: cover;object-position: center;border: 2px solid transparent;border-radius: 2rem 0 2rem 0;transition: border .25s;} .wrap-major-sns .img-box::before {content: '';position: absolute;right: 2rem;top: 0;width: 4.5rem;height: 4.5rem;background-color: #fff;background-repeat: no-repeat;background-position: center;border-radius: 1.5rem 0 1.5rem 0;} .wrap-major-sns li.y .img-box::before {background-image: url(../images/ic-youtube-color.png);} .wrap-major-sns li.y .img-box::after {content: '';position: absolute;left: 50%;top: 50%;transform: translate(-50%, -50%);width: 8rem;height: 8rem;background: url(../images/ic-video-play.png) no-repeat center left 3rem;opacity: 0;border: 2px solid #fff;border-radius: 50%;transition: opacity .25s;} .wrap-major-sns li.y a:hover .img-box::after {opacity: 1;} .wrap-major-sns li.p .img-box::before {background-image: url(../images/ic-gallery-color.png);} .wrap-major-sns li a:hover .img-box img {overflow: hidden;border: 2px solid #fff;} .wrap-major-sns .text-box {color:#fff;} .wrap-major-sns .sj { font-size: 2.2rem; font-family: sl; line-height: 3.5rem; } .wrap-major-sns .sj span {position: relative;display: inline-block; max-width: 100%;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;transition: color .25s;} .wrap-major-sns a:hover .sj span {color: #05e2b5;} .wrap-major-sns .sj span::before {content: '';position: absolute;bottom: .2rem;left: 0;width: 0;height: 1px;background: #05e2b5;transition: width .25s;} .wrap-major-sns a:hover .sj span::before {width: 100%;} .wrap-major-sns .cn {font-family: pl; font-size: 1.8rem; line-height: 3rem; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; margin-top: -.7rem; min-height:6rem;color: #909090;transition: color .25s;} .wrap-major-sns a:hover .cn {color: #fff;} .wrap-major-sns .hashtag {position: relative; margin-top: 2.2rem;} .wrap-major-sns .hashtag span {display: inline-block;font-size: 1.6rem; font-family: pl; background:#2E41B6; border-radius:5rem; padding:0.8rem 1.5rem; margin-right: 1rem;} .wrap-major-sns .more {height:5rem;font-size: 1.6rem; font-family: sl; color:#fff; text-transform: uppercase; display: flex; align-items: center; border:0.1rem solid #fff; border-radius:5rem; padding:0 1.5rem;} .wrap-major-sns .more::after {content:''; width: 0.9rem; height:0.9rem; display: inline-block; margin-left: 2.3rem; background:url(../images/ic-more.png) no-repeat center; transform: translateY(-0.1rem);} .wrap-major-sns .more:hover {border-color:#45E99A; color:#45E99A} .wrap-major-sns .more:hover::after {background:url(../images/ic-more-on.png) no-repeat center;} .wrap-major-sns .loop {position: absolute; bottom:0; left:0; width:100%;} .wrap-major-sns svg {width:100%;} .wrap-major-sns .sns-banner {display: flex;justify-content: space-between;align-items: center;padding: 0 3rem 0 2.4rem;background: #2c2c2c;border-radius: .5rem;} .wrap-major-sns .sns-banner > li {transition: .3s;} .wrap-major-sns .sns-banner > li.facebook {width: 2.5rem;margin-right: 1.8rem;background: url(../images/ic-facebook.png) no-repeat center;} .wrap-major-sns .sns-banner > li.insta {width: 2.5rem;margin-right: 2.8rem;background: url(../images/ic-insta.png) no-repeat center;} .wrap-major-sns .sns-banner > li.youtube {width: 2.5rem;margin-right: 3rem;background: url(../images/ic-youtube.png) no-repeat center;} .wrap-major-sns .sns-banner > li.blog {width: 4.4rem;margin-right: 2.5rem;background: url(../images/ic-blog.png) no-repeat center;} .wrap-major-sns .sns-banner > li.cafe {width: 2.3rem;background: url(../images/ic-cafe.png) no-repeat center} .wrap-major-sns .sns-banner > li:last-child {margin-right: 0 !important;} .wrap-major-sns .sns-banner > li > a {display: block;height: 5rem;text-indent: -9999px;border-radius: .5rem;} .wrap-major-sns .sns-banner > li.facebook:hover {background: url(../images/ic-facebook-on.png) no-repeat center;} .wrap-major-sns .sns-banner > li.insta:hover {background: url(../images/ic-insta-on.png) no-repeat center;} .wrap-major-sns .sns-banner > li.youtube:hover {background: url(../images/ic-youtube-on.png) no-repeat center;} .wrap-major-sns .sns-banner > li.blog:hover {background: url(../images/ic-blog-on.png) no-repeat center;} .wrap-major-sns .sns-banner > li.cafe:hover {background: url(../images/ic-cafe-on.png) no-repeat center;} @media screen and (max-width: 1800px) { .wrap-major-sns .title {width: 50rem;} .wrap-major-sns .slider-box {width: 101rem;} .wrap-major-sns .img-box {width: 45rem;} } @media screen and (max-width: 1700px) { #multipleContentsDiv_dept_687, #multipleContentsDiv_dept_1748, #multipleContentsDiv_dept_2118, #multipleContentsDiv_dept_2668, #multipleContentsDiv_dept_3258, #multipleContentsDiv_dept_3049, #multipleContentsDiv_dept_3070, #multipleContentsDiv_dept_3091, #multipleContentsDiv_dept_3112, #multipleContentsDiv_dept_3133, #multipleContentsDiv_dept_3177, #multipleContentsDiv_dept_3201, #multipleContentsDiv_dept_3226, #multipleContentsDiv_dept_3249, #multipleContentsDiv_dept_3279, #multipleContentsDiv_dept_3300, #multipleContentsDiv_dept_3321, #multipleContentsDiv_dept_3355, #multipleContentsDiv_dept_3414, #multipleContentsDiv_dept_3449, #multipleContentsDiv_dept_3504, #multipleContentsDiv_dept_3532, #multipleContentsDiv_dept_3588, #multipleContentsDiv_dept_3610, #multipleContentsDiv_dept_3874, #multipleContentsDiv_dept_4415, #multipleContentsDiv_dept_4804, #multipleContentsDiv_dept_5300, #multipleContentsDiv_dept_5557, #multipleContentsDiv_dept_6075, #multipleContentsDiv_dept_6264, #multipleContentsDiv_dept_6712, #multipleContentsDiv_dept_7009, #multipleContentsDiv_dept_7252, #multipleContentsDiv_dept_7739, #multipleContentsDiv_dept_7987, #multipleContentsDiv_dept_8300, #multipleContentsDiv_dept_8382, #multipleContentsDiv_dept_13840 {flex-direction: column;padding: 0 4rem 6.5rem;} .wrap-major-sns .title {width: 100%;margin-bottom: 2.5rem;padding-top: 5.5rem;} .wrap-major-sns h2 {display: inline-block;margin-bottom: 1rem;} .wrap-major-sns h2::before { left: auto;right: -30.5rem;top: -9.7rem;width: 17.2rem;height: 16.1rem;transform: scaleX(-1);} .wrap-major-sns h2 br{display: none;} .wrap-major-sns .text-box {padding-right: 2rem;} .wrap-major-sns .text-box br {display: none;} .wrap-major-sns .slider-box {width: 100%;} .wrap-major-sns .img-box {width: 80%;} } @media screen and (max-width: 1400px) { .wrap-major-sns .img-box {width: 100%;} } @media screen and (max-width: 1024px) { #multipleContentsDiv_dept_687, #multipleContentsDiv_dept_1748, #multipleContentsDiv_dept_2118, #multipleContentsDiv_dept_2668, #multipleContentsDiv_dept_3258, #multipleContentsDiv_dept_3049, #multipleContentsDiv_dept_3070, #multipleContentsDiv_dept_3091, #multipleContentsDiv_dept_3112, #multipleContentsDiv_dept_3133, #multipleContentsDiv_dept_3177, #multipleContentsDiv_dept_3201, #multipleContentsDiv_dept_3226, #multipleContentsDiv_dept_3249, #multipleContentsDiv_dept_3279, #multipleContentsDiv_dept_3300, #multipleContentsDiv_dept_3321, #multipleContentsDiv_dept_3355, #multipleContentsDiv_dept_3414, #multipleContentsDiv_dept_3449, #multipleContentsDiv_dept_3504, #multipleContentsDiv_dept_3532, #multipleContentsDiv_dept_3588, #multipleContentsDiv_dept_3610, #multipleContentsDiv_dept_3874, #multipleContentsDiv_dept_4415, #multipleContentsDiv_dept_4804, #multipleContentsDiv_dept_5300, #multipleContentsDiv_dept_5557, #multipleContentsDiv_dept_6075, #multipleContentsDiv_dept_6264, #multipleContentsDiv_dept_6712, #multipleContentsDiv_dept_7009, #multipleContentsDiv_dept_7252, #multipleContentsDiv_dept_7739, #multipleContentsDiv_dept_7987, #multipleContentsDiv_dept_8300, #multipleContentsDiv_dept_8382, #multipleContentsDiv_dept_13840 {background:url(../images/bg-major-sns-tablet.jpg) no-repeat left top / cover;} .wrap-major-sns .title {margin-bottom: 1.5rem;} .wrap-major-sns h2 {line-height: 1.3;font-size: 4rem;} .wrap-major-sns .img-box {height: 27rem;} .wrap-major-sns .sns-banner { padding: 0 1.3rem 0 1rem;} .wrap-major-sns .sns-banner > li.facebook {margin-right: 1.1rem;background-size: 1rem;} .wrap-major-sns .sns-banner > li.insta {margin-right: 1.8rem;transform: translateY(.1rem);background-size: 2rem;} .wrap-major-sns .sns-banner > li.youtube {margin-right: 1.9rem;background-size: 2.2rem;} .wrap-major-sns .sns-banner > li.blog {margin-right: 1.5rem;transform: translateY(.1rem);background-size: 4rem;} .wrap-major-sns .sns-banner > li.cafe {transform: translateY(.1rem);background-size: 2rem;} .wrap-major-sns .sns-banner > li > a {height: 4rem;} .wrap-major-sns .sns-banner > li.facebook:hover {background: url(../images/ic-facebook-on.png) no-repeat center / 1rem;} .wrap-major-sns .sns-banner > li.insta:hover {background: url(../images/ic-insta-on.png) no-repeat center / 2rem;} .wrap-major-sns .sns-banner > li.youtube:hover {background: url(../images/ic-youtube-on.png) no-repeat center / 2.2rem;} .wrap-major-sns .sns-banner > li.blog:hover {background: url(../images/ic-blog-on.png) no-repeat center / 4rem;} .wrap-major-sns .sns-banner > li.cafe:hover {background: url(../images/ic-cafe-on.png) no-repeat center / 2rem;} } @media screen and (max-width: 950px) { .wrap-major-sns h2 {width: 100%;padding-right: 20rem;} .wrap-major-sns h2::before {width: 15rem;right: 0;top: -8.7rem} } @media screen and (max-width: 768px) { #multipleContentsDiv_dept_687, #multipleContentsDiv_dept_1748, #multipleContentsDiv_dept_2118, #multipleContentsDiv_dept_2668, #multipleContentsDiv_dept_3258, #multipleContentsDiv_dept_3049, #multipleContentsDiv_dept_3070, #multipleContentsDiv_dept_3091, #multipleContentsDiv_dept_3112, #multipleContentsDiv_dept_3133, #multipleContentsDiv_dept_3177, #multipleContentsDiv_dept_3201, #multipleContentsDiv_dept_3226, #multipleContentsDiv_dept_3249, #multipleContentsDiv_dept_3279, #multipleContentsDiv_dept_3300, #multipleContentsDiv_dept_3321, #multipleContentsDiv_dept_3355, #multipleContentsDiv_dept_3414, #multipleContentsDiv_dept_3449, #multipleContentsDiv_dept_3504, #multipleContentsDiv_dept_3532, #multipleContentsDiv_dept_3588, #multipleContentsDiv_dept_3610, #multipleContentsDiv_dept_3874, #multipleContentsDiv_dept_4415, #multipleContentsDiv_dept_4804, #multipleContentsDiv_dept_5300, #multipleContentsDiv_dept_5557, #multipleContentsDiv_dept_6075, #multipleContentsDiv_dept_6264, #multipleContentsDiv_dept_6712, #multipleContentsDiv_dept_7009, #multipleContentsDiv_dept_7252, #multipleContentsDiv_dept_7739, #multipleContentsDiv_dept_7987, #multipleContentsDiv_dept_8300, #multipleContentsDiv_dept_8382, #multipleContentsDiv_dept_13840 {padding: 0 2rem 5.5rem;background:url(../images/bg-major-sns-mobile.jpg) no-repeat right top / cover;} .wrap-major-sns h2 {padding-right: 9rem;margin-bottom: 1rem;font-size: 3.2rem;} .wrap-major-sns h2::before {width: 13rem;;top: -8.3rem;right: -2.1rem;transform: scaleX(-1) rotate(50deg);} .wrap-major-sns .prevnext {margin-right: 2.4rem;} .wrap-major-sns .text-box {padding-right: 0;} .wrap-major-sns .title {margin-bottom: 3.1rem;} .wrap-major-sns .cn {min-height: 4.4rem;font-size: 1.6rem;line-height: 2.5rem;} .wrap-major-sns .swiper-slide-active .sj span {color: #05e2b5;} .wrap-major-sns .swiper-slide-active .sj span::before {width: 100%;} .wrap-major-sns .swiper-slide-active .cn {color: #fff;} } @media screen and (max-width: 600px) { .wrap-major-sns h2 {padding-right: 8rem;} .wrap-major-sns h2::before {right: -1rem;} } /* [E] wrap-major-sns */