@charset "utf-8";
.img.mob { display:none !important; } 

.area_visual { position:relative; width: 100%; margin:0 auto; } 
.area_visual .list li a { display:block; } 
.area_visual .list li a,
.area_visual .list li div { overflow:hidden; } 
.area_visual .list .web { display:block; overflow:hidden; position:relative; padding-top:721rem; } 
.area_visual .list .web img { position:absolute; left:50%; top:0rem; height:100%; transform:translateX(-50%); width: 100%; } 
.area_visual .list .mob { display:none; } 
.area_visual .bx-controls.bx-has-pager { position: absolute; bottom: 34rem; left: 50%; transform: translateX(-50%); z-index: 90; } 
.area_visual .bx-pager.bx-default-pager { display: flex; } 
.area_visual .bx-pager-item:nth-child(n+2) { margin-left: 15rem; } 
.area_visual .bx-pager-link { font-size: 0; width: 12rem; height: 12rem; background: #fff; border-radius: 100%; display: block; opacity: .3; } 
.area_visual .bx-pager-link.active { opacity: 1; } 

.main-visual__txt { position: absolute; bottom: 128rem; left: 200rem; z-index: 90; color: #fff; } 
.main-visual__txt span { font-size: 26rem; } 
.main-visual__txt h1 { font-size: 74rem; font-family: 'GmarketSans'; padding-top: 20rem; } 
.main-visual__txt a { width: 184rem; height: 56rem; background: #7dc623; color: #fff; border-radius: 6rem; text-align: center; line-height: 56rem; display: block; font-size: 20rem; font-weight: 600; margin-top: 65rem; } 
.main-visual__btn { position: absolute; top: 50%; right: 200rem; transform: translateY(-50%); z-index: 90; } 
.main-visual__btn li { background: #fff; border-radius: 8rem; height: 110rem; width: 350rem; position: relative; } 
.main-visual__btn li:nth-child(1) {background: #236af7;} 
.main-visual__btn li::before { content: ''; position: absolute; top: 50%; right: 38rem; transform: translateY(-50%); } 
.main-visual__btn li:nth-child(1)::before { background: url('../images/common/ic-main__btn05.svg') no-repeat; width: 52rem; height: 51rem; } 
.main-visual__btn li:nth-child(2)::before { background: url('../images/common/ic-main__btn01.svg') no-repeat; width: 52rem; height: 51rem; } 
.main-visual__btn li:nth-child(3)::before { background: url('../images/common/ic-main__btn02.svg') no-repeat; width: 52rem; height: 51rem; } 
.main-visual__btn li:nth-child(4)::before { background: url('../images/common/ic-main__btn03.svg') no-repeat; width: 49rem; height: 51rem; } 
.main-visual__btn li:nth-child(5)::before { background: url('../images/common/ic-main__btn04.svg') no-repeat; width: 49rem; height: 51rem; } 
.main-visual__btn li:nth-child(n+2) { margin-top: 12rem; } 
.main-visual__btn li a { display: flex; justify-content: center; flex-direction: column; height: 100%; padding: 0 38rem; } 
.main-visual__btn li a span { font-size: 16rem; color: #aaa; font-size: 16rem; font-weight: 500; font-family: 'Poppins', sans-serif; display: block; } 
.main-visual__btn li:nth-child(1) a span { color: #fff;} 
.main-visual__btn li a strong {font-size: 20rem;color: #282828;padding-top: 6rem;} 
.main-visual__btn li:nth-child(1) a strong{color: #ffe955; letter-spacing:-1px;} 
.main_delivery{text-align:center;}
.main_delivery img{width:100%}
.main_delivery.mob {display: none;}

.notice-wrap { overflow:hidden; background:#fff; border-bottom: 1rem solid #e8e8e8; } 
.notice-wrap h2 { display:inline-block; font-size:16rem; font-weight: 600; } 
.notice-wrap h2 i { position: relative; padding-right: 45rem; } 
.notice-wrap h2 i::before { content: ''; position: absolute; top: 50%; left: 0; transform: translateY(-50%); background: url('../images/common/ic-notice.svg') no-repeat; width: 30rem; height: 31rem; } 
.notice-inr:after { content:''; display:block; clear:both; } 
.notice-inr > div { display:flex; flex-direction:row; align-items:center; width:100%; height:150rem; box-sizing:border-box; color:#fff; } 
.notice-inr { width:1520rem; margin:0 auto; } 
.notice-cont { position:relative; } 
.notice-cont h2 { font-size: 20rem; color: #111; } 
.notice-cont .bx-wrapper { width:85%; margin-left:5%; } 
.notice-cont .list { width:calc(100% - 130rem) !important; } 
.notice-cont .list li { width:80% !important; } 
.notice-cont .list a { display:flex; align-items: center; color:#666; font-size:16rem; font-weight:400; } 
.notice-cont .list a p { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color: #101010;} 
.notice-cont .list a span { display: inline-block; font-size: 16rem; color: #aaa; padding-left: 25rem; } 
.notice-cont .bx-controls { position:absolute; right:0rem; top:0rem; height:100%; } 
.notice-cont .bx-controls > div { display:flex; flex-direction:row; align-items:center; height:100%; justify-content: end; } 
.notice-cont .bx-controls > div:after { content:''; display:block; clear:both; } 
.notice-cont .bx-controls a { display:block; float:left; width:50%; text-align:center; color:#aaa; font-size:0; transition:0.3s ease; } 
.notice-cont .bx-controls a.bx-next { background: url('../images/common/ic-arr__ver2.svg') no-repeat; width: 34rem; height: 34rem; } 
.notice-cont .bx-controls a.bx-prev { background: url('../images/common/ic-arr__ver2.svg') no-repeat; width: 34rem; height: 34rem; transform: rotate(180deg); margin-right: 10rem; } 
.notice-cont .bx-controls a:hover { color:#0b327a; } 

.product-tit { display: flex; align-items: center; justify-content: space-between; padding-bottom: 38rem; } 
.product-tit h2 { font-family: 'GmarketSans'; font-weight: bold; font-size: 45rem; color: #111; } 
.product-tit h2 span { font-weight: 300; } 
.more-btn { font-size: 16rem; color: #282828 !important; width: 200rem; height: 60rem; text-align: center; line-height: 60rem; background: #f8f8f8; display: block; border-radius: 5rem; margin: 0 auto; } 
.more-btn i { position: relative; padding-left: 37rem; } 
.more-btn i::before { content: ''; position: absolute; background: url('../images/common/ic-more.svg') no-repeat; width: 29rem; height: 29rem; top: 50%; right: 0; transform: translateY(-50%); } 

#content { width: 1520rem; margin: 0 auto; } 
#content > div[class^="area_"] { margin-top:100rem; } 
#content .area_info h2 { margin-bottom:10rem; font-size:17rem; font-weight:600; color:#222; } 
.area_best { margin-top: 78rem !important; } 



 @media screen and (max-width:1780px){
    #content,
    .notice-inr { width: 1200rem; } 
 }
@media screen and (max-width:1580px){
    .main-visual__txt { left: 50rem; } 
    .main-visual__txt h1 { font-size: 60rem; } 
    .main-visual__btn { right: 50rem; } 
 }
@media screen and (max-width:1024px){
    #content,
    .notice-inr { width: auto; margin: 0 30rem; } 

    .area_best { margin-top: 300rem !important; } 
    .area_best *[data-shop-list="default"] > li *[data-shop-list="util"] { left:10rem; } 
    
    .area_visual { height: 540rem; margin: 70rem auto 0; } 
    .area_visual .list .web { padding-top: 540rem; } 
    .main-visual__btn { display: grid; grid-template-columns: 1fr 1fr; gap: 12rem; width: 90%; margin: 0 auto; right: unset; left: 50%; transform: translateX(-50%); top: 59%; } 
    .main-visual__btn li { height: 98rem; width: auto; } 
    .main-visual__btn li:nth-child(n+2) { margin-top: 0; } 
    .main-visual__btn li a span { font-size: 14rem; } 
    .main-visual__btn li a strong { font-size: 20rem; padding-top: 3rem; } 
    .main-visual__btn li::before { width: 40rem !important; height: 40rem !important; } 

    .main-visual__txt { top: 32%; } 
    .main-visual__btn { position: unset; transform: unset; margin: 348rem 20rem 0; gap: 8rem; width: auto; } 
    .main-visual__btn li { border: 1rem solid #e8e8e8; } 
    
    .product-tit h2 { font-size: 38rem; } 

    .notice-cont h2 { padding-left:0px; border-left-width:0px; } 
    .notice-cont .bx-wrapper { width:auto; margin-left:5%; } 
    .notice-cont .list { width:auto !important; } 
    .notice-cont .list li { width:calc(100% - 220rem) !important; } 
    .notice-inr { padding-right:0px; } 
    .notice-inr > div.story { display:none; } 
    .notice-inr > div { width:100%; } 

    .main_delivery.mob {display: block;}
    .main_delivery.pc {display: none;}
 }
 
@media screen and (max-width:860px){
    .area_visual {height: 674rem;} 
    .area_visual img { width: 100%; } 
    .area_visual .bx-controls.bx-has-pager { bottom: 30rem; } 
    .area_visual .bx-pager-item:nth-child(n+2) { margin-left: 9rem; } 
    .area_visual .bx-pager-link { width: 10rem; height: 10rem; } 
    .area_visual .list .web { display:none; } 
    .area_visual .list .mob { display:block; } 
    .area_visual .bx-controls .bx-next,
    .area_visual .bx-controls .bx-prev { opacity:1; } 
    .main-visual__btn {margin: 305rem 20rem 0;}

    .notice-wrap { margin-top: 0; } 

    .product-tit { padding-bottom: 25rem; } 
    .product-tit h2 { font-size: 32rem; } 

    #content, .notice-inr { margin: 0 20rem; } 

    
 }

@media screen and (max-width:540px){
    .area_visual {height: 329rem;}
    .main-visual__txt { left: 20rem; top: 42%; } 
    .main-visual__txt span { font-size: 16rem; } 
    .main-visual__txt a { width: 120rem; height: 38rem; line-height: 38rem; margin-top: 26rem; font-size: 15rem; } 
    .main-visual__txt h1 { font-size: 28rem; padding-top: 8rem; } 
    .main-visual__btn { margin: 340rem 20rem 0; } 
    .main-visual__btn li { height: 85rem; } 
    .main-visual__btn li a { padding: 0 14rem; } 
    .main-visual__btn li a span { font-size: 10rem; } 
    .main-visual__btn li a strong { font-size: 14rem; } 
    .main-visual__btn li::before { width: 25rem !important; height: 25rem !important; right: 14rem; } 
    .product-tit h2 { font-size: 26rem; } 
    .more-btn i { padding-left: 30rem; } 
    .more-btn i::before { width: 24rem; height: 24rem; } 
    .area_best { margin-top: 260rem !important; } 
    
    .product-tit { padding-bottom: 22rem; } 

    .notice-cont h2 { font-size: 16rem; margin-bottom: 5rem; } 
    .notice-cont .list a { font-size: 15rem; flex-direction: column; align-items: start; } 
    .notice-cont .list li {width: 100% !important;} 
    .notice-cont .list a p { width: 100%; } 
    .notice-cont .list a span { font-size: 13rem; padding-left: 0; padding-top: 3rem; } 
    .notice-cont .bx-wrapper { margin-left: 0; margin-top:15rem; width: 100%;} 
    .notice-cont .bx-controls {height: unset; top: 25rem;}
    .notice-cont .bx-controls a.bx-prev { margin-right: 5rem; } 
    .notice-inr > div { flex-direction: column; align-items: start; height: 250rem; justify-content: center; } 
    .notice-wrap h2 i { padding-right: 25rem; } 
    .notice-wrap h2 i::before { width: 18rem; height: 19rem; } 

    .more-btn { width: 160rem; height: 45rem; line-height: 45rem; } 

    #content > div[class^="area_"] { margin-top: 70rem; } 

    *[data-shop-list="default"] { gap: 0 12rem; } 
    *[data-shop-list="default"] > li .img { height: 135rem !important; } 

    .area_visual .bx-controls.bx-has-pager { bottom: 20rem; } 
 }
 

@media screen and (max-width:400px) {
    /* .notice-cont .bx-wrapper { margin-left:3%; }  */
    .notice-cont .bx-controls { width:90px; } 
    .notice-cont .bx-controls > div { padding:0px; } 
 }