@charset "utf-8";


#mVisual {position:relative; width:100%; height:950px;  overflow:hidden; background:#DDD}
.mv_slider.slick-slide,
.mvWrap .slick-track,
.mvWrap .slick-list{ position:relative; height:100%; outline:none; }

#mVisual .mv_slider { background-repeat: no-repeat; background-size: cover; background-position: right center; }

#mVisual .mv_slider.mv1 { background-image:url('/images/main/m_visual1.jpg'); }
#mVisual .mv_slider.mv2 { background-image:url('/eng/images/main/mv2.png'); } 

#mVisual .mv_slider .mv-txt { display:table; width:92%; height:100%;  margin:0 auto;; max-width: 1600px; position:relative;  z-index:3 }
#mVisual .mv_slider .mv-txt div { padding-top:100px; color:#fff;  display:table-cell; vertical-align:middle; box-sizing:border-box;}
#mVisual .mv_slider .mv-txt div .t1 { font-size:16.8rem;  font-family: 'Jost'; font-weight:900;  line-height:1.0em; text-shadow:3px 3px 5px rgba(0,0,0,0.05)}
#mVisual .mv_slider .mv-txt div .t2 { margin:1em 0; font-size: 3.7rem;  line-height: 1.2em; letter-spacing:0.03em; font-weight:700; font-family: 'montserrat';}
#mVisual .mv_slider .mv-txt div .t3 { font-size: 2.2rem; line-height: 1.6em; letter-spacing:0.03em;  }

.mVod { position: relative; width: 100%; height: 100%; object-fit: cover}
/* .mVod::before { content: ''; width: 100%; height: 100%; background: rgba(0,0,0,0.05); position: absolute; left:0; bottom:0; display: block; z-index:10; } */
.mVod iframe { position: absolute; left: 50%; bottom:0; width: 222vh; height: 115.2vh; object-fit: cover; transform:translateX(-50%)}


#mVisual .y_list{display: flex; flex-wrap: wrap; align-content: space-between; justify-content: center;}
#mVisual .t_txt{padding-top: 150px; text-align: center; font-size: 8.5rem; color: #502c1d; font-family: 'jost'; line-height: 8.5rem; width: 100%;}
#mVisual .t_txt h3{font-weight: 900;}
#mVisual .years{display: flex; text-align: center; flex-wrap: wrap;}
#mVisual .years li{position: relative; z-index: 15;width: calc(100%/3); display: flex; flex-direction: column;}
#mVisual .years li:after{position: absolute; content: ''; width: 100%; height: 1px; background: #d3c9c0; left: 0; top: 90px; z-index: -1;}
#mVisual .years h3{font-size: 5rem; color: #f5b335; font-family: 'jost'; font-weight: 900;}
#mVisual .years .dot{width: 15px; height: 15px; border-radius: 100px; background: #f5b335;margin: 10px auto 20px;}
#mVisual .years p{font-weight: 500; color: #222; font-size: 2.3rem; line-height: 3rem;margin-bottom: 20px; min-height: 120px;display: flex; align-items: center; justify-content: center;}
#mVisual .years .img{width: 100%; position: relative; text-align: right;}
#mVisual .years .img h4{position: absolute; right: 40px; bottom: 40px; font-family: 'jost'; font-size: 4rem; font-weight: 800; color: #fff; line-height: 4.5rem;text-shadow: 1px 1px 30px rgba(0, 0, 0, 0.5);}
#mVisual .years .img img{width: 100%;}

@media all and (max-width:1780px){
    #mVisual .years p{padding: 0 20px; font-size: 2rem;}
    #mVisual .years p br{display: none;}
}
@media all and (max-width:1480px){
    #mVisual {height:850px; }
	#mVisual .mv_slider .mv-txt div .t1 { font-size:15rem; }
	#mVisual .mv_slider .mv-txt div .t2 { font-size: 3.5rem; }
	#mVisual .mv_slider .mv-txt div .t3 { font-size: 2.0rem;}
    #mVisual .t_txt{padding-top: 150px; font-size: 7rem; line-height: 7.5rem;}
    #mVisual .years p{font-size: 1.8rem;min-height: 150px;}
    #mVisual .years .img h4{font-size: 3rem; line-height: 3.5rem; right: 20px; bottom: 20px;}
}
@media all and (max-width:1280px){
    #mVisual .t_txt{padding-top: 200px; font-size: 5rem; line-height: 5.5rem;}
    #mVisual .years h3{font-size: 4rem;}
    #mVisual .years li:after{top: 75px;}
    #mVisual .years p{font-size: 1.6rem;min-height: 150px;}
}
@media all and (max-width:1080px){
    #mVisual .t_txt{padding-top: 130px; font-size: 5rem; line-height: 5.5rem;}
    #mVisual .years li{width: 100%; height: 19vw; overflow: hidden;justify-content: start;}
    #mVisual .years .txt{position: absolute; top: 0;z-index: 10; left: 50%; transform: translateX(-50%);background: rgba(0,0,0,0.5); width: 100%; height: 100%; text-align: left; padding: 0 20px;}
    #mVisual .years .txt .dot{margin: 0;}
    #mVisual .years h3{margin-top: 10px; padding-left: 30px; text-align: center;}
    #mVisual .years p{min-height: 0; color: #fff; text-align: left; justify-content: start; padding-left: 30px; text-align: center;}
    #mVisual .years li:after{position: absolute; content: ''; width: 1px; height: 100%; background: #f5b33557; left: 27px; top: 0px; z-index: 10;}
    #mVisual .years .img{transform: translatey(-20%);}
    #mVisual .years .img h4{display: none;}
}
@media all and (max-width:1024px){
    #mVisual {height:80vw; }
    #mVisual .mv_slider .mv-txt div .t1 { font-size:13rem; }
	#mVisual .mv_slider .mv-txt div .t2 { font-size: 3.0rem; }
	#mVisual .mv_slider .mv-txt div .t3 { font-size: 1.8rem;}
}
@media all and (max-width:976px){
    #mVisual {height:850px; }
    #mVisual .years li{height:190px;}
    #mVisual .y_list{align-content: end; gap: 40px;}
	#mVisual .mv_slider .mv-txt div  {padding-top:0; text-align:center}
	#mVisual .mv_slider {background-position:center bottom}
	#mVisual .mv_slider.mv1 { background-image:url('/images/main/m_visual1-mo.jpg'); }
}
@media all and (max-width:840px){
    #mVisual .t_txt{padding-top: 150px; font-size: 4rem; line-height: 4.5rem;}
}
@media all and (max-width:580px){
    #mVisual {height:800px; }
}
@media all and (max-width:480px){
    
    #mVisual .mv_slider .mv-txt div .t1 { font-size:11rem; }
	#mVisual .mv_slider .mv-txt div .t2 { font-size: 2.4rem; }
	#mVisual .mv_slider .mv-txt div .t3 { font-size: 1.6rem;}
    #mVisual .t_txt{padding-top: 10vh;}
    #mVisual .years h3{font-size: 3rem;margin-top: 20px;}
    #mVisual .years p{font-size: 1.4rem; line-height: 2rem;}
    #mVisual .years .img{transform: translatey(0%);}
}



.m-Part {padding:120px 0}

#mTitle h4 { font-size:2.0rem; font-weight:700; color:#512d1e; line-height:1.2em}
#mTitle h3 { padding-top:35px; font-size:5rem; font-weight:700; color:#512d1e; line-height:1.2em}
#mTitle h3 .point { font-size:6.0rem; font-weight:800; }
#mTitle .t1 {padding-top:20px; font-weight:600; color:#512d1e; opacity:.4}
#mTitle .t2 {font-size:1.8rem; padding-top:30px; font-weight:400; color:#FFF; opacity:.5}

#mTitle h3 br.br640 {display:none}

#mTitle h3.eng { font-family:'Jost'; font-size:6.0rem; line-height:1.0em }
#mTitle h3.eng .point { font-size:7.0rem; color:#f5b335 }

br.mo{display: none;}

@media all and (max-width:1280px){
    .m-Part {padding:100px 0}
}
@media all and (max-width:976px){
    .m-Part {padding:80px 0}
    #mTitle h3 { padding-top:30px;}
	#mTitle .t1 {padding-top:15px }
    #mTitle h3 { font-size:5.0rem;  }
    #mTitle h3 .point { font-size:6.0rem;  }
}
@media all and (max-width:767px){
    .m-Part {padding:60px 0}
	#mTitle h4 { font-size:1.8rem}
    br.mo{display: block;}
    
	#mTitle h3.eng { font-size:5.0rem; }
	#mTitle h3.eng .point { font-size:6.0rem; }
}
@media all and (max-width:640px){
    #mTitle h3 br.br640 {display:block}
}
@media all and (max-width:480px){
    #mTitle h3 { padding-top:20px;  font-size: 3.5rem;}
    #mTitle h3 .point { font-size:4rem;  }
	#mTitle .t1 {padding-top:10px }
	#mTitle .t2 {padding-top:20px; }
}




#mPart1 { background:#fffbf2; position:relative}


#title dl dd {font-size:2.0rem; color:#512d1e; line-height:3rem; font-weight:600}
#title dl h3 {font-size:6rem; color:#512d1e; font-weight:900; font-family: 'jost'; margin: 10px 0; line-height: 6.5rem;}
#title dl dt {font-size:2.8rem; color:#f5b335; line-height:3rem; font-weight:700}
#title dl dt span {display:inline-block; padding-right:20px; }
#title dl img {width:100%; max-width:700px; padding:40px 0 25px}

#mPart1 .i_box { overflow: hidden; width: 100%; position: relative; margin-top: 100px;}
#mPart1 .i_box ul { display: flex; width: max-content; animation: scroll-left 80s linear infinite; }
#mPart1 .i_box ul li { flex: 0 0 auto; }
#mPart1 .i_box ul li img { display: block; width: 100%; height: 350px; }

@keyframes scroll-left { 
    0% { transform: translateX(0); } 
    100% { transform: translateX(-50%); } 
}
#mPart1 .i_box::before,
#mPart1 .i_box::after {content: '';position: absolute;top: 0;width: 300px;height: 100%;z-index: 2;pointer-events: none;}
#mPart1 .i_box::before {left: 0;background: linear-gradient(to right, #fffbf2,  rgba(255, 255, 255, 0));}
#mPart1 .i_box::after {right: 0;background: linear-gradient(to left, #fffbf2, rgba(255, 255, 255, 0));}

@media all and (max-width:1280px){
    #title dl dd {font-size:1.8rem; line-height:2.5rem;}
    #title dl h3 {font-size:6rem; line-height: 6.5rem;}
    #title dl dt {font-size:2.5rem;}
    #mPart1 .i_box {margin-top: 80px;}
    #mPart1 .i_box ul li{height: 400px;}
    #mPart1 .i_box ul li img{height: 100%; width: auto;}
    #mPart1 .i_box::before,
    #mPart1 .i_box::after {width: 10%;}
}
@media all and (max-width:1024px){
    #title dl img {width:65% }
}
@media all and (max-width:976px){
    #title dl h3 {font-size:5rem; line-height: 6rem;margin: 20px 0 10px;}
    #title dl dt {font-size:2.2rem;}
    #mPart1 .i_box {margin-top: 60px;}
}
@media all and (max-width:767px){
    #mPart1 .i_box ul {animation: scroll-left 50s linear infinite; }
}
@media all and (max-width:480px){
    #title dl dd {font-size:1.6rem; line-height:2.3rem;}
    #title dl h3 {font-size:4rem; line-height: 4.5rem;margin: 20px 0 20px;}
    #title dl dt {font-size:1.7rem; line-height: 2.3rem;}
    #mPart1 .i_box ul li{height: 300px;}
    #mPart1 .i_box {margin-top: 50px;}
}





#mPart2 {position:relative; overflow:hidden; background: #fff;}
#mPart2 .slick-list {height:100%;}
#mPart2 .slick-track {height:100%;}
#mPart2 .slick-slide {height:100%;}
#mPart2 > div {height:100%; position:relative;}
#mPart2 .m-inner {height:100%; position:relative;}
#mPart2 #mTitle {position:relative;}

.slick-custom-nav {position: absolute; top: 0px; width: 150px; right: 0; display: flex; justify-content: space-between; pointer-events: none;}
.slick-custom-prev, .slick-custom-next {width: 70px; height: 70px; background-size: cover; background-repeat: no-repeat; border: none; cursor: pointer; pointer-events: auto;}
.slick-custom-prev {background-image: url('/eng/images/main/prev_a_250509.png');}
.slick-custom-next {background-image: url('/eng/images/main/next_a_250509.png');}

#mPart2 #cont {text-align:center}

#mPart2 #cont h3 {margin-top:15px; display:inline-block; font-size:15.0rem; line-height:1.2em; color:#f5b335; font-weight:900; font-family:'Roboto'; letter-spacing:-0.03em; position:relative}
#mPart2 #cont h3:before {content:''; width:145px; height:145px; background:url('/eng/images/main/mpart2-bubble_eng.png')no-repeat left top; background-size:100% auto; position:absolute; right:-120px; top:-100px; animation: motion3 0.6s linear 0s infinite alternate;}
#mPart2 #cont .year-day {display:flex; justify-content:center; }
#mPart2 #cont .year-day li {padding:15px; font-size:2.2rem; color:#512d1e; font-weight:700}
#mPart2 #cont .year-day li .num {font-size:3.8rem; font-family:'Roboto'; font-weight:900;  letter-spacing:-0.03em;}
#mPart2 #cont .year-day li .br640 {display:none}

#mPart2 #cont .iconWrap {width:100%; display:flex; justify-content:space-between; position:absolute; bottom:100px;  z-index:5  }
#mPart2 #cont .iconWrap ul {display:flex; justify-content:space-between;}
#mPart2 #cont .iconWrap ul li {margin:0 20px; text-align:center}
#mPart2 #cont .iconWrap ul li img{width: 150px; margin: 0 auto;}
#mPart2 #cont .iconWrap ul li dl dt { margin:10px 0 25px; padding:0.7em 1.5em; display:inline-block; background:#512d1e; color:#FFF; border-radius:50px; font-weight:400; position:relative}
#mPart2 #cont .iconWrap ul li dl dt:before {content:''; border-bottom: 10px solid transparent; border-top: 10px solid #512d1e; border-left: 10px solid transparent; border-right: 10px solid transparent; position:absolute; left:50%; bottom:-18px; margin-left:-10px}
#mPart2 #cont .iconWrap ul li dl dd { font-size:1.8rem; color:#512d1e; font-weight:700}

#mPart2 #cont .img {display: flex; justify-content: center;margin: 20px 0;}
/* #mPart2 #cont .img { position:absolute; bottom:20px; left:50%; transform:translateX(-50%); z-index:3  } */
#mPart2 #cont .img img {width:100%; max-width:526px}

#mPart2 #txtMove {position:absolute; bottom:0;  line-height:50px; background:#f5b335;  z-index:-1; width: 100%;}
#mPart2 #txtMove .in {display: flex;  white-space: nowrap;    overflow: hidden;    transition: 0.3s; }
#mPart2 #txtMove .in li { animation: textLoop 50s linear infinite;  cursor: default;}
#mPart2 #txtMove .in span {font-size:2.8rem; font-family:'Jost'; font-weight:700; padding:0 15px; color:#ffdb8e; text-transform:uppercase}

#txtMove { bottom:0;  line-height:50px; background:#f5b335;  z-index:-1}
#txtMove .in {display: flex;  white-space: nowrap;    overflow: hidden;    transition: 0.3s; }
#txtMove .in li { animation: textLoop 50s linear infinite;  cursor: default;}
#txtMove .in span {font-size:2.8rem; font-family:'Jost'; font-weight:700; padding:0 15px; color:#ffdb8e; text-transform:uppercase}

.anchor {  display: block;  height: 80px; margin-top: -80px;   visibility: hidden; }
@keyframes motion3 {
	0% {  margin-top:0}
	100% {  margin-top:10px}
}

@keyframes textLoop {
    0% {
        -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0);
    }
    100% {
        -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0);
    }
}

@media all and (max-width:1540px){
	#mPart2 #cont h3:before {right:-30px; top:-100px; } 
}
@media all and (max-width:1380px){
	#mPart2 #cont h3 {font-size:10vw}
}
@media all and (max-width:1280px){
	#mPart2 #cont h3:before { width:100px; top:-100px}
	#mPart2 #cont .img {width:35%; margin: 20px auto;}
    #mPart2 #cont .iconWrap ul li img{width: 100px;}
    #mPart2 #cont .iconWrap ul li dl dt { margin:10px 0 20px; padding:0.5em 1em; font-size: 13px;}
    #mPart2 #cont .iconWrap ul li dl dd { font-size:1.6rem;}
}
@media all and (max-width:1024px){

	#mPart2 #cont {padding:10vw 0 0}
	#mPart2 #cont h3:before { right:-20px; }
	#mPart2 #cont h3 {margin-top:0; font-size:12vw}
    #mPart2 #cont .year-day li {font-size:2rem; }
	#mPart2 #cont .year-day li .num {font-size:2.5rem;}

	#mPart2 #cont .iconWrap {justify-content:center;  position:inherit}
	#mPart2 #cont .iconWrap ul li {margin:0 10px;}

	#mPart2 #cont .img {width:40%;}

    .slick-custom-nav {width: 110px;right: auto; left: 50%; transform: translateX(-50%); top: auto; bottom: -70px;}
    .slick-custom-prev, .slick-custom-next {width: 50px; height: 50px;}
}
@media all and (max-width:976px){
	#mPart2 #mTitle {text-align:center}
	#mPart2 #cont {padding:80px 0 0}
	#mPart2 #cont h3:before { width:100px; top:-80px}
	#mPart2 #cont .img {width:60%; padding-bottom:20px; margin:0 auto; transform:translateX(0);  position:inherit}
}
@media all and (max-width:767px){
    #mPart2 #cont h3:before { right:-10px; }
    
    
	#mPart2 #cont .iconWrap {display:block}
	#mPart2 #cont .iconWrap ul { justify-content: center;}
	#mPart2 #cont .iconWrap ul li {margin:10px }
}
@media all and (max-width:640px){
    #mPart2 #cont {padding:60px 0 0}
	#mPart2 #cont .year-day li .br640 {display:block}
	#mPart2 #cont .img {width:80%;}
    .slick-custom-nav {width: 65px; bottom: -50px;}
    .slick-custom-prev, .slick-custom-next {width: 30px; height: 30px;}
    #mPart2 #cont .iconWrap ul li dl dt {font-size: 11px;}
    #mPart2 #cont .iconWrap ul li dl dd { font-size:1.4rem;}
}
@media all and (max-width:480px){
	#mPart2 #cont h3 {font-size:13vw}
	#mPart2 #cont h3:before { width:14vw; right:0; top:-14vw}

	#mPart2 #cont .year-day li {font-size:1.8rem; }
	#mPart2 #cont .year-day li .num {font-size:2.3rem;}

	#mPart2 #cont .iconWrap { margin:10px 0 20px; }
	#mPart2 #cont .iconWrap ul li img {width:80px}
	#mPart2 #cont .iconWrap ul li dl dt { margin:5px 0 15px; }

	#mPart2 #txtMove { line-height:40px;}
	#mPart2 #txtMove .in span {font-size:2.4rem;}
	#txtMove { line-height:40px;}
	#txtMove .in span {font-size:2.4rem;}
}
@media all and (max-width:380px){
	#mPart2 #cont .iconWrap ul li img {width:90px}
}






#mPart3 {height:auto; background:#fffcf5; position:relative}
#mPart3 #title {margin-bottom:50px; display:flex;  justify-content:space-between;  align-items: end; }
#mPart3 #title #tab {padding-bottom:7px}
#mPart3 #title #tab li {display:inline-block; padding:0.5em 1.5em;  border:4px solid #512d1e; border-radius:50px;}
#mPart3 #title #tab li.active {background:#512d1e; }
#mPart3 #title #tab li a {font-size:2.2rem; font-family:'Jost'; font-weight:700;  color:#512d1e; }
#mPart3 #title #tab li.active a { color:#FFF;}

#mPart3 .tabs2,
#mPart3 #cont2 {display:none}

.menuList {}
/* .menuList {width:calc(100% + 30px); margin-left:-15px; padding-bottom:100px;} */
.menuList li {/*margin:0 15px; */ height:460px;  border-radius:10px; overflow:hidden; }

.cardWrap{ position: relative; width: 100%; height: 100%;  }
.cardWrap:hover > .thecard { transform: rotateY(180deg); cursor: pointer; }
.thecard{ position: absolute; width: 100%; height: 100%; transform-style: preserve-3d; transition: all 0.5s ease; }

.cardWrap:hover > .thehover .front { display:none}
.cardWrap:hover > .thehover .back { backface-visibility: visible; transform: rotateY(0); cursor: pointer;  }

/*.thecard:hover{ transform: rotateY(180deg); }*/
.front{ position: absolute; width: 100%; height: 100%; backface-visibility: hidden; background: #FFF; }
.front .txt {position:absolute; left:30px; top:40px; color:#512d1e; border-radius:10px; z-index:2}
.front .txt dt { font-size:3.2rem; font-weight:700}
.front .txt dd { margin-top:0.7em; font-size:2.0rem; font-weight:700; font-family:'Jost'; text-transform:uppercase; line-height:1.2em; opacity:.3 }
.front .front-img {position:absolute; right:0; bottom:0; width:100%; z-index:1}
.back{ position: absolute; width: 100%; height: 100%; backface-visibility: hidden; background:url('/images/main/bgb-bg.png') ;
		transform: rotateY(180deg);  display:table; text-align:center; color:#FFF ; border-radius:10px; }
.back .in {display:table-cell; vertical-align:middle;  }
.back img {margin:0 auto}
.back h3 {margin:1em 0 0.5em; font-size:3.2rem; color:#ffd881}
.back .t1 {font-size:1.8rem; line-height:1.4em; width:90%; margin:0 auto}


#mPart3 .swiper-button-prev, 
#mPart3 .swiper-button-next  {font-size: 0; line-height: 0; position: absolute; display: block; padding: 0; margin:0; cursor: pointer; color: transparent; border: none; outline: none;  background-repeat: no-repeat; background-position: center; background-size: 100% auto; z-index: 1;  }
#mPart3 .swiper-button-prev,
#mPart3 .swiper-button-next {   top: 25px; bottom:0;  width: 67px; height: 26px;  }
#mPart3 .swiper-button-prev {left:calc(100% - 134px); background-image: url("/images/main/arrow_prev.png"); border-right:1px solid #DDD}
#mPart3 .swiper-button-next { right:0%; background-image: url("/images/main/arrow_next.png"); }


.m_wrap{width: 100%;}
.m_item{width: 100%;}
.m_item img{width: 100%; }

@media all and (max-width:1599px){
    #mPart3 {height:auto; }	
	.menuList li { height:29vw; }
}
@media all and (max-width:1399px){
    .menuList li { height:30vw; }
}
@media all and (max-width:1274px){
    .menuList li { height:40vw; }
}
@media all and (max-width:1024px){
    #mPart3 #title {margin-bottom:50px; }
	.menuSwiper {padding-bottom:70px !important; } 
	.menuList li { height:40vw; }
}
@media all and (max-width:1023px){
    #mPart3 .tabs,
	#mPart3 #cont {display:none}
	#mPart3 .tabs2,
	#mPart3 #cont2 {display:block}
}
@media all and (max-width:849px){
    #mPart3 #title {flex-wrap:wrap; text-align:center}
	#mPart3 #title #mTitle,
	#mPart3 #title #tab {width:100%}
	#mPart3 #title #tab {margin-top:20px}
	.menuList li { height:58vw;}
    #mPart3 .swiper-button-prev,
    #mPart3 .swiper-button-next  {top: 70px;}
    #mPart3 .swiper-button-prev {left:calc(50% - 67px);}
    #mPart3 .swiper-button-next {right: auto; left: 50%;}
    .m_wrap{margin-top: 100px;}
}

@media all and (max-width:639px){
    .menuList {width:90%; margin:0 auto}
	.menuList li { height:96vw;}
	.front .txt { top:30px; }
	.front .txt dt { font-size:4.0rem}
	.front .txt dd { font-size:2.4rem; }
	.back h3 {font-size:3.8rem;}
	.back .t1 {font-size:2.2rem; max-width:375px;}
}
@media all and (max-width:580px){
	.front .txt dt { font-size:3.6rem}
	.front .txt dd { font-size:2.0rem; }
	.back h3 {font-size:3.4rem;}
	.back .t1 {font-size:1.8rem; max-width:375px;}
}
@media all and (max-width:480px){
	#mPart3 #title .tabs li a {font-size:2.0rem;}
	.menuSwiper {padding-bottom:50px !important; } 
	.menuList li { height:100vw;}

	.front .txt dt { font-size:3.2rem}
	.front .txt dd { font-size:2.0rem; }
	.back h3 {font-size:3.2rem;}
	.back .t1 {font-size:1.8rem; }
    #mPart3 .swiper-button-prev,
    #mPart3 .swiper-button-next  {top: 19vw;}
}




#mPart4 {height:950px;}
#mPart4 #title { padding:100px 0; background:url('/images/main/mstore-bg.png') no-repeat right top; background-size:cover}
#mPart4 #title .store {margin-top:20px; display:flex; justify-content:center; flex-wrap:wrap; }
#mPart4 #title .store li { padding:5px 30px; font-size:3.0rem; font-weight:700; color:#FFF; line-height:1.3em}
#mPart4 #title .store li .num {font-size:4.0rem; color:#f5b335; font-family:'Jost'; font-weight:700}


#mPart4 #mSearch {width:90%; max-width:784px; line-height:80px; margin:-40px auto 0; border-radius:50px; 
						background:#afa09a; display:flex}
#mPart4 #mSearch #msearch {width: calc(100% - 80px);  height: 80px;  line-height: 80px; color:#FFF;
									 font-size: 2.0rem;  padding: 0 30px;  border:0;  background:transparent; box-sizing: border-box; }
#mPart4 #mSearch #msearch::placeholder {color:#FFF; opacity:.5}
#mPart4 #mSearch #msearch-btn {width: 80px; height: 80px; background: url('/images/main/msearch.png') no-repeat center center;  background-size: 100% auto; }

@media all and (max-width:1499px){
	#mPart4 {height:auto}
	#mPart4 #title .store li { padding:5px 20px; }
}
@media all and (max-width:767px){
	#mPart4 #mSearch { line-height:60px; margin:-30px auto 0; }
	#mPart4 #mSearch #msearch {width: calc(100% - 60px);  height: 60px;  line-height: 60px; }
	#mPart4 #mSearch #msearch-btn {width: 60px; height: 60px; }
}
@media all and (max-width:480px){
	#mPart4 #title .store li { font-size:2.2rem; padding:5px 13px; }
#mPart4 #title .store li .num {font-size:3.2rem; }
}


#mPart4 #cont {padding:60px 0; display:flex; flex-wrap:wrap}
#mPart4 #cont #mTitle {width:calc(100% - 1222px)}
#mPart4 #cont #mTitle .t1 {font-size:1.8rem; line-height:1.4em}
#mPart4 #cont .storeList {width:1222px; position:relative}
#mPart4 #cont .storeList:before {content:''; width:30px; height:100%; background:#FFF; position:absolute; right:0; top:0; z-index:3 }
#mPart4 #cont .storeList li {margin-right:30px;}
#mPart4 #cont .storeList li img {width:100%; border-radius:10px; overflow:hidden}
#mPart4 #cont .storeList li h3 {margin:20px 0 10px; font-size:2.4rem; font-weight:700; color:#512d1e}
#mPart4 #cont .storeList li p { font-weight:600; color:#847169; display:flex; }
#mPart4 #cont .storeList li p i {color:#512d1e}
#mPart4 #cont .storeList li p span {padding-left:10px;}
#mPart4 #cont .storeList li p.add {}
#mPart4 #cont .storeList li p.tel {line-height:23px; margin-top:7px; font-family:'Jost'; font-weight:600;  align-items: center;  }

@media all and (max-width:1599px){
	#mPart4 #cont #mTitle {width:20%}
	#mPart4 #cont .storeList {width:80%}
}
@media all and (max-width:1280px){
	#mPart4 #cont {display:flex; flex-wrap:wrap}
	#mPart4 #cont #mTitle {width:100%}
	#mPart4 #cont #mTitle h3 br {display:none}
	#mPart4 #cont .storeList { padding-top:30px; width:100%}
	#mPart4 #cont .storeList:before {background:#DDD; width:7px}
	#mPart4 #cont .storeList:after {content:''; width:9px; height:100%; background:#DDD; position:absolute; left:0; top:0; z-index:3}
	#mPart4 #cont .storeList li {margin-right:0; margin:0 10px}
}
@media all and (max-width:580px){
	#mPart4 #cont .storeList {max-width:480px; margin:0 auto}
	#mPart4 #cont .storeList li { margin:0}
	#mPart4 #cont .storeList:before,
	#mPart4 #cont .storeList:after {display:none}
	#mPart4 #cont #mTitle {width:100%; text-align:center}
}
@media all and (max-width:480px){
#mPart4 #cont .storeList { padding-top:50px;}
}


.m_menu{width: 100%; background: url('/eng/images/main/m_menu_bg1.png') center center / cover no-repeat; padding: 120px 0 60px;}
.m_menu2{ background: url('/eng/images/main/m_menu_bg2.png') center center / cover no-repeat;}
.m_menu #mTitle h3{color: #fbd438;}
.m_menu #mTitle .t1{padding-top: 10px; color: #fff; line-height: 2.5rem; font-weight: 400;opacity: 1; font-size: 1.8rem;}
.m_menu_c{display: flex;justify-content: space-between;gap: 50px;padding-bottom: 160px;}
.m_menu_c .lt{margin-top: 60px;}
.m_menu_c .lt .box{display: flex; gap: 40px;}
.m_menu_c .lt .box + .box{margin-top: 30px;}
.m_menu_c .lt .box .num h3{color: #f5b335; font-family: 'jost'; font-weight: 300;font-size: 5rem; line-height: 5rem;}
.m_menu_c .lt .box .info h4{color: #502c1d; font-size: 2.5rem;margin: 5px 0;}
.m_menu_c .lt .box .info p{color: #222; font-size: 1.6rem; line-height: 2rem;}
.m_menu_c .rt{margin-top: -100px; height: 560px; overflow: hidden; position: relative;}
.m_menu_c .rt img {height: 100%;}


@media all and (max-width:1400px){
    .m_menu{padding: 140px 0 90px;}
    .m_menu_c .lt .box{gap: 30px;}
    .m_menu_c .lt .box .num h3{font-size: 5rem;}
    .m_menu_c .lt .box .info h4{font-size: 3rem;}
    .m_menu_c .lt .box .info p br{display: none;}
    .m_menu_c .rt{display: none;}
}
@media all and (max-width:1280px){
    .m_menu{padding: 120px 0 90px;}
    .m_menu_c .rt{margin-top: 30px; width: 160vw;}
    .m_menu_c .rt img{width: 100%;}
    .m_menu #mTitle .t1{line-height: 2.5rem; font-size: 1.8rem;}
}
@media all and (max-width:1024px){
    .m_menu{padding: 80px 0 90px;}
    .m_menu_c{flex-wrap: wrap;}
    .m_menu_c .rt{overflow: hidden; height: 33vw;}
    .m_menu_c .rt img{transform: translateY(-50%);}
}
@media all and (max-width:880px){
    .m_menu_c .rt{height: 45vw;}
    .m_menu_c .rt img{transform: translateY(-50%);}
}
@media all and (max-width:640px){
    .m_menu_c{padding-bottom: 100px;}
    .m_menu_c .lt{margin-top: 30px;}
    .m_menu_c .lt .box + .box{margin-top: 30px;}
    .m_menu_c .lt .box .num h3{font-size: 4rem;}
    .m_menu_c .lt .box .info h4{font-size: 2.3rem;}
    .m_menu_c .lt .box .info p{font-size: 1.6rem; line-height: 2.2rem;}
    .m_menu_c .rt{height: 85vw;}
    .m_menu_c .rt img{transform: translateY(-20%);}
}
@media all and (max-width:480px){
    .m_menu{padding: 60px 0 90px;}
    .m_menu #mTitle .t1{line-height: 1.8rem; font-size: 1.5rem;}
    .m_menu_c .lt .box .num h3{font-size: 3rem; line-height: 3.5rem;}
    .m_menu_c .lt .box .info h4{font-size: 1.8rem;}
    .m_menu_c .lt .box .info p{font-size: 1.4rem; line-height: 2rem;margin-top: 10px;}
    .m_menu_c .lt .box{gap: 20px;}
}


#m_map{position: relative; background: #fffbf2;} 
#m_map .map-container { position: relative; width: 100%; height: 100%;}
#m_map .map-img { width: 100%; height: 100%; display: block; position: relative; background: #fffbf2; max-width: 1920px; margin: 0 auto; max-height: 980px; overflow: hidden;}
#m_map .map-img img{}
#m_map .map-img .line .china{position: absolute; top: 231px; left: 368px;clip-path: inset(0 0 0 100%); transition: clip-path 2s ease-out;-webkit-clip-path: inset(0 0 0 100%);}
#m_map .map-img .line .japan{position: absolute; top: 221px; left: 628px; clip-path: inset(0 100% 0 0); -webkit-clip-path: inset(0 100% 0 0); transition: clip-path 2s ease-out;}
#m_map .map-img .line .taiwan{position: absolute; top: 310px; left: 600px;clip-path: inset(0 0 100% 0); -webkit-clip-path: inset(0 0 100% 0); transition: clip-path 2s ease-out;}
#m_map .map-img .line .vietnam{position: absolute; top: 313px; left: 362px;clip-path: inset(0 0 100% 0); -webkit-clip-path: inset(0 0 100% 0); transition: clip-path 2s ease-out;}
#m_map .map-img .line .singapore{position: absolute; top: 303px; left: 280px;clip-path: inset(0 0 100% 0); -webkit-clip-path: inset(0 0 100% 0); transition: clip-path 2s ease-out;}
#m_map .map-img .line .china.active,
#m_map .map-img .line .japan.active,
#m_map .map-img .line .taiwan.active,
#m_map .map-img .line .vietnam.active,
#m_map .map-img .line .singapore.active {
  clip-path: inset(0);
  -webkit-clip-path: inset(0);
}
#m_map .map-img .line img{width: 100%;}
#m_map .cont{position: absolute;width: 100%; height: 100%; top: 0;left: 0;}
#m_map .cont .m-inner{display: flex;flex-wrap: wrap; align-content: end; flex-direction: column;}
#m_map .cont #title{text-align: right;}
#m_map .cont .box{width: 50%; background: #fff; padding: 30px 50px; border-radius: 5px; box-shadow: 1px 1px 20px 10px rgba(0,0,0,0.05); font-family: 'jost';margin-top: 50px;}
#m_map .cont .box h3{font-size: 3.5rem; color: #f5b335;}
#m_map .cont .box p{font-size: 2.5rem; color: #502c1d; margin: 10px 0 30px; font-weight: bold;}
#m_map .cont .box img{width: 100%;}

#m_map .swiper-button-prev, 
#m_map .swiper-button-next  {font-size: 0; line-height: 0; position: absolute; display: block; padding: 0; margin:0; cursor: pointer; color: transparent; border: none; outline: none;  background-repeat: no-repeat; background-position: center; background-size: 100% auto; z-index: 1;  }
#m_map .swiper-button-prev,
#m_map .swiper-button-next {   top: 25px; bottom:0;  width: 67px; height: 26px;  }
#m_map .swiper-button-prev {left:calc(98% - 134px); background-image: url("/images/main/arrow_prev.png"); border-right:1px solid #DDD}
#m_map .swiper-button-next { right:2%; background-image: url("/images/main/arrow_next.png"); }

@media all and (max-width:1600px){
    #m_map .map-img > img{transform: translateX(-15%);}
    #m_map .map-img .line .china{left: 78px;}
    #m_map .map-img .line .japan{left: 343px;}
    #m_map .map-img .line .taiwan{left: 315px;}
    #m_map .map-img .line .vietnam{left: 73px;}
    #m_map .map-img .line .singapore{left: -10px;}
}
@media all and (max-width:1280px){
    #m_map .map-img > img{width: 135%;}
    #m_map .cont .box{padding: 30px;width:60%;margin-top: 20px;}
    #m_map .cont .box h3{font-size: 3rem;}
    #m_map .cont .box p{font-size: 2rem;}
    #m_map .map-img .line .china{top: 19.5%; left: 5.5%; width: 17.5%;}
    #m_map .map-img .line .japan{top: 19.5%; left: 24%; width: 10.3%;}
    #m_map .map-img .line .taiwan{top: 27%; left: 22%; width: 9%;}
    #m_map .map-img .line .vietnam{top: 26.8%; left: 4.5%; width: 17.3%;}
    #m_map .map-img .line .singapore{top: 26%; left: -0.5%; width: 22.3%;}
}
@media all and (max-width:1180px){
    #m_map .map-img > img{width: 150%;}
    #m_map .map-img .line .china{top: 20.5%; left: 6.5%; width: 18.5%;}
    #m_map .map-img .line .japan{top: 19.5%; left: 27%; width: 11.3%;}
    #m_map .map-img .line .taiwan{top: 27%; left: 24.5%; width: 10%;}
    #m_map .map-img .line .vietnam{top: 27.8%; left: 5.5%; width: 18.3%;}
    #m_map .map-img .line .singapore{top: 27%; left: -0.8%; width: 24.5%;}
}
@media all and (max-width:840px){
    #m_map .map-img > img{transform: translateX(-5%);}
    #m_map .map-img > img{width: 200%;}
    #m_map .cont{ background: #fffbf29f; opacity: 0; transition: opacity 1s ease; display: flex; align-items: center;}
    #m_map .cont .m-inner{gap: 10vw;}
    #m_map .cont.active {opacity: 1;}
    #m_map .cont .box{width: 100%;}
    #m_map .map-img .line .china{top: 20.5%; left: 28.5%; width: 24.5%;}
    #m_map .map-img .line .japan{top: 19.5%; left: 55%; width: 15.3%;}
    #m_map .map-img .line .taiwan{top: 28%; left: 52.5%; width: 13%;}
    #m_map .map-img .line .vietnam{top: 27.8%; left: 27.5%; width: 25%;}
    #m_map .map-img .line .singapore{top: 27%; left: 19.2%; width: 32.5%;}
}
@media all and (max-width:580px){
    #m_map .map-img > img{transform: translateX(-15%);}
    #m_map .map-img > img{width: 300%;}
    /* #m_map .cont{position: relative;} */
    #m_map .cont .box h3{font-size: 2.6rem;}
    #m_map .cont .box p{margin: 5px 0 20px;font-size: 1.8rem;}
    #m_map .swiper-button-prev,
    #m_map .swiper-button-next {top: 20px; width: 40px; height: 15px;  }
    #m_map .swiper-button-prev {left:calc(98% - 80px);}
    #m_map .map-img .line .china{top: 20%; left: 12.5%; width: 38.5%;}
    #m_map .map-img .line .japan{top: 19.5%; left: 53%; width: 23.3%;}
    #m_map .map-img .line .taiwan{top: 27.5%; left: 49%; width: 19.5%;}
    #m_map .map-img .line .vietnam{top: 27%; left: 10.5%; width: 38%;}
    #m_map .map-img .line .singapore{top: 26%; left: -1.8%; width: 50%;}
}


#conf{width: 100%; max-width: 1920px; margin: 0 auto;}
.conf_item{display: flex !important; width: 100%; align-items: center;}
.conf_item .lt{width: 50%; padding-left: 160px;}
.conf_item .lt h3{color: #512d1e; font-family: 'jost'; font-size: 4rem; line-height: 5rem; margin-bottom: 40px;}
.conf_item .lt p{color: #512d1e; font-size: 1.8rem; line-height: 2.6rem;}
.conf_item .lt p + p{margin-top: 30px;}
.conf_item .lt .arrow{height: 60px; display: flex; gap: 5px; margin-top: 40px;}
.conf_item .lt span.mo{display: none;}
#conf .slick-prev,
#conf .slick-next {position: relative;  width: 60px; height:60px;  }
#conf .slick-prev {background-image: url("/images/main/store_prev.png");}
#conf .slick-next {background-image: url("/images/main/store_next.png"); }
.conf_item .rt{width: 50%;}
.conf_item .rt img{width: 100%;}

@media all and (max-width:1600px){
    .conf_item .lt{padding-left: 120px;}
    .conf_item .lt h3{margin-bottom: 20px;}
    .conf_item .lt p + p{margin-top: 10px;}
}
@media all and (max-width:1480px){
    .conf_item .lt{padding-left: 80px; width: 40%;}
    .conf_item .lt h3{font-size: 3rem; line-height: 4rem;}
    .conf_item .lt p{font-size: 1.6rem; line-height: 2.4rem;}
    .conf_item .rt{width: 60%;}
}
@media all and (max-width:1280px){
    .conf_item .lt{padding-left: 2%;}
    .conf_item .lt .arrow{height: 50px; margin-top: 20px;}
    #conf .slick-prev,
    #conf .slick-next {width: 50px; height:50px;}
}
@media all and (max-width:1080px){
    .conf_item{flex-wrap: wrap;}
    .conf_item .lt{width: 100%; padding: 50px 3%; height: 100%;}
    .conf_item .rt{width: 100%;}
    .conf_item .lt span.mo{display: block;}
}
@media all and (max-width:480px){
    .conf_item .lt{padding: 40px 3%;}
    .conf_item .lt h3{font-size: 2.8rem; line-height: 3rem;}
    .conf_item .lt .arrow{height: 40px; margin-top: 10px;}
    #conf .slick-prev,
    #conf .slick-next {width: 40px; height:40px;}
}


#overseas{width: 100%; background: url('/eng/images/main/overseas_bg.png') center center / cover no-repeat;}
#overseas .top{text-align: center; font-family: 'jost'; color: #fff; font-size: 6rem; margin-bottom: 60px; font-weight: 900;}
#overseas ul{display: flex; justify-content: center; gap: 70px;}
#overseas li{text-align: center;}
#overseas li h3{font-family: 'jost'; font-size: 3.5rem; font-weight: 900; color: #f5b335; margin: 40px 0 30px;}
#overseas li p{font-size: 1.8rem; color: #fff; line-height: 2.5rem;}

@media all and (max-width:1400px){
    #overseas .top{font-size: 5rem;}
    #overseas li{width: 20%;}
    #overseas li img{width: 100%;}
}
@media all and (max-width:1280px){
    #overseas li h3{font-size: 3rem; margin: 30px 0 20px;}
    #overseas li p{font-size: 1.6rem;line-height: 2.3rem;}
}
@media all and (max-width:1080px){
    #overseas .top{font-size: 4rem; margin-bottom: 40px;}
    #overseas ul{gap: 40px;}
    #overseas li h3{font-size: 2.5rem;}
    #overseas li p{font-size: 1.5rem;}
}
@media all and (max-width:780px){
    #overseas .top{font-size: 3.5rem;line-height: 4.5rem;}
    #overseas ul{flex-wrap: wrap;}
    #overseas li{width: 30%;}
}
@media all and (max-width:580px){
    #overseas li{width: calc(100%/2 - 60px);}
}
@media all and (max-width:480px){
    #overseas ul{gap: 20px;}
    #overseas li{width: calc(100%/2 - 40px);}
    #overseas li h3{font-size: 2.3rem; margin: 20px 0 10px;}
}


#model{background: url('/eng/images/main/model_bg.png') no-repeat 100% 90%;}
#model #title {display: flex; justify-content: space-between;}
#model .eng {font-weight: 900;}
#model .cont-wrap { overflow: hidden; position: relative; width: 100%;  margin-top: 100px;overflow: visible !important;}
#model .cont-slider { display: flex; transition: transform 0.6s ease-in-out; width: 100%; }
#model .cont { width: 100%; flex-shrink: 0;}
#model .model_list {display: flex !important; gap: 190px;}
#model .model_list .lt {width: 50%;max-width: 710px;position: relative; padding: 10px;}
#model .model_list .lt::before{width: calc(100% - 20px); height: calc(100% - 20px); content: '';position: absolute; left: 0; top: 0; background: #f5b335;}
#model .model_list .lt .item{width: 100%;}
#model .model_list .lt .item img{width: 100%;}
#model .model_list .rt {width: 50% !important; display: flex;align-items: center; }
#model .model_list .rt ul{display: flex; flex-wrap: wrap; flex-direction: column;gap: 25px; justify-content: center; width: 100%;}
#model .model_list .rt ul li span{display: inline-block; width: 210px; background: #502c1d; border-radius: 100px; height: 50px; line-height: 50px;font-family: 'jost'; color: #fff; font-weight: bold; text-align: center; font-size: 3rem; margin-right: 50px;}
#model .model_list .rt ul li{font-size: 3rem; font-weight: 600; color: #222;}

#model .dot li h3 {font-family: 'jost'; font-weight: 900; font-size: 5rem; margin-bottom: 20px; line-height: 5rem; color: #d6d6d6; transition: 0.3s; display: flex; flex-wrap: wrap; gap: 20px; align-items: center;}
#model .dot li h3 span{font-size: 3rem;}
#model .dot li img{height: 76px; opacity: 0.5; filter: grayscale(1); transition: 0.3s;}
#model .dot li.active h3 {color: #f5b335; transition: 0.3s;}
#model .dot li.active h3 span{color: #502c1d;}
#model .dot li.active img {opacity: 1; filter: grayscale(0); transition: 0.3s;}
#model .dot li p {font-family: 'jost'; color:#502c1d; font-size: 1em; font-weight: bold; margin-top: 10px; text-align: center;}
#model .dot { display: flex; gap: 60px;cursor: pointer; }

#model .slick-prev,
#model .slick-next{font-size: 0; line-height: 0; position: absolute; display: block; padding: 0; cursor: pointer; color: transparent; border: none; outline: none;  background-repeat: no-repeat; background-position: center; background-size: 100% auto; z-index: 1; width: 60px; height:60px;  top: 50%; transform: translateY(-50%);}
#model .slick-prev {background-image: url("/images/main/store_prev.png"); left: -20px;}
#model .slick-next {background-image: url("/images/main/store_next.png"); right: -20px;}


@media all and (max-width:1600px){
    #model .model_list {gap: 100px;}
    #model .model_list .rt ul{gap: 15px;}
    #model .model_list .rt ul li{font-size: 2.5rem;}
    #model .model_list .rt ul li span{font-size: 2.5rem; margin-right: 30px;}
}
@media all and (max-width:1280px){
    #model .cont-wrap {margin-top: 100px;}
    #model .model_list {gap: 70px;}
    #model .model_list .rt ul{gap: 15px;}
    #model .model_list .rt ul li{font-size: 2.2rem;}
    #model .model_list .rt ul li span{font-size: 2.2rem;width: 160px;}
    #model .dot li h3 {font-size: 3rem; line-height: 3rem;margin-bottom: 10px;}
    #model .dot li h3 span{font-size: 2.5rem;}
    #model .dot li img{height: 50px;}
}
@media all and (max-width:1080px){
    #model #title {flex-wrap: wrap; justify-content: center;}
    #model #mTitle {width: 100%; margin-bottom: 50px;}
    #model .model_list {flex-wrap: wrap; justify-content: center;}
    #model .model_list .lt {width: 100%;}
    #model .model_list .rt {width: 80% !important;}
}
@media all and (max-width:780px){
    #model .cont-wrap {margin-top: 50px;}
    #model #mTitle {width: 100%; margin-bottom: 50px;}
    #model .model_list {gap: 40px;}
    #model .model_list .lt {width: 90%;}
    #model .model_list .rt {width: 90% !important;}
    #model .model_list .rt ul li span{width: 140px; height: 40px; line-height: 40px;font-size: 2rem;}
    #model .dot li h3 {gap: 10px;}
    #model .dot li h3 span{font-size: 2rem; width: 100%;}
    #model .dot li img{height: 30px;}
    #model .dot li p {font-size: 0.8em; margin-top: 5px;}
    #model .slick-prev,
    #model .slick-next{width: 50px;height: 50px;}
}
@media all and (max-width:480px){
    #model .cont-wrap {margin-top: 30px;}
    #model .dot{gap: 25px;}
    #model .dot li h3 {font-size: 2.5rem; line-height: 2.5rem; gap: 0px;}
    #model .dot li h3 span{font-size: 0.6em;}
    #model .model_list .lt {width: 100%;}
    #model .slick-prev,
    #model .slick-next{width: 40px;height: 40px;}
    #model .slick-prev{left: -10px;}
    #model .slick-next{right: -10px;}
    #model .model_list .rt{width: 100% !important;}
    #model .model_list .rt ul li span{width: 130px; height: 30px; line-height: 30px;font-size: 1.8rem; margin-right: 15px;}
    #model .model_list .rt ul li{font-size: 1.8rem;}
    #model .dot li p {font-size: 0.7em;}
}


#frc{background: #fffbf2;}
#frc #mTitle h3{text-align: center; font-weight: 900;}
#frc .cont{margin-top: 80px;}
.responsive-table {width: 100%;overflow-x: auto; text-align: center;}
.responsive-table table {width: 100%;border-collapse: collapse;min-width: 800px;}
.hint {font-size: 13px;color: #888;margin-bottom: 8px; text-align: right;}
.scroll-hint {font-size: 13px;color: #888;margin-bottom: 8px;display: none; text-align: right;}
.responsive-table th{background: #502c1d; font-family: 'jost';font-weight: 900; font-size: 3rem;padding: 20px; color: #fff;}
.responsive-table tr td:first-child{border-left: 0;}
.responsive-table tr td:last-child{border-right: 0;}
.responsive-table td {background: #fff; border: 1px solid #502c1d; padding: 30px 10px;color: #502c1d; font-size: 2.2rem; font-weight: 500;}

.responsive-table2 {width: 100%;overflow-x: auto; text-align: center;}
.responsive-table2 tr.second th{background: #d0cab7; color: #502c1d; border: 1px solid #fff;}
.responsive-table2 table {width: 100%;border-collapse: collapse;min-width: 800px;}
.responsive-table2 th{background: #f5b335; font-family: 'jost';font-weight: 900; font-size: 3rem;padding: 20px; color: #502c1d;}
.responsive-table2 tr td:first-child{border-left: 0;}
.responsive-table2 tr td:last-child{border-right: 0;}
.responsive-table2 td {background: #fff; border: 1px solid #d0cab7; padding: 20px 30px;color: #502c1d; font-size: 2.2rem; font-weight: 500; line-height: 3rem;}
.responsive-table2 ul {counter-reset: li-counter;list-style: none;padding: 0; text-align: left;}
.responsive-table2 ul li {position: relative;padding-left: 1.2em;}
.responsive-table2 ul li::before {counter-increment: li-counter;content: counter(li-counter) ". ";position: absolute;left: 0;color: #502c1d;}
.responsive-table2 ul li.cau {list-style: none;position: relative;padding-left: 1.2em; font-weight: bold;}
.responsive-table2 ul li.cau::before {content: "※";position: absolute;left: 0;color: #502c1d;}

@media (max-width: 1280px) {
    #frc .cont{margin-top: 50px;}
    .responsive-table th{font-size: 2.5rem; padding: 10px;}
    .responsive-table td {padding: 20px 10px;font-size: 1.8rem;}
    .responsive-table2 th{font-size: 2.5rem; padding: 10px;}
    .responsive-table2 td {padding: 10px; font-size: 1.8rem; line-height: 2.5rem;}
}
@media (max-width: 840px) {
    .responsive-table {overflow-x: auto;}
    .responsive-table table {min-width: 100%;}
    .responsive-table2 table {min-width: 100%;}
    .hint {margin-bottom: 4px;}
    /* .scroll-hint {display: block;} */
}
@media (max-width: 680px) {
    #frc .cont{margin-top: 30px;}
    .responsive-table th{font-size: 2rem;}
    .responsive-table td {padding: 20px 10px;font-size: 1.6rem;}
    .responsive-table2 th{font-size: 2rem; padding: 5px;}
    .responsive-table2 td {padding: 5px; font-size: 1.6rem; line-height: 2.2rem;}
}
@media (max-width: 480px) {
    .responsive-table th{font-size: 1.4rem;}
    .responsive-table td {padding: 5px;font-size: 1.2rem;}
    .responsive-table2 th{font-size: 1.4rem;}
    .responsive-table2 td {font-size: 1.2rem; line-height: 2rem;}
}


#n_brand{text-align: center; position: relative;}
#n_brand::before{content: 'SAMSONG BAKERY'; position: absolute; font-weight: 900; bottom: -50px; left: 50%; transform: translateX(-50%); width: 120%; font-size: 20rem; line-height: 20rem; font-family: 'jost';color: #f5b335; opacity: 0.2; letter-spacing: -3px;}
#n_brand #mTitle h3{font-weight: 900; margin-bottom: 80px;}
.brd_list li{text-align: center; border: 1px solid #eeeeee; border-radius: 10px; background: #fff; padding: 20px;margin: 0 20px;font-family: 'jost';}
.brd_list li img{margin: 0 auto; max-width: 327px; width: 100%;}
.brd_list li h3{margin: 30px 0 15px; font-size: 2.2rem; color: #222; position: relative;}
.brd_list li h3::before{content: '-'; position: absolute; left: 50%; color: #222; font-family: 'jost'; font-size: 2rem; bottom: -20px; font-weight: normal; transform: translateX(-50%);}
.brd_list li p{font-size: 2.2rem; color: #222;}
br.br1280{display: none;}
.brd_list{position:relative;overflow:hidden;}
.brd_list::before,.brd_list::after{content:"";position:absolute;top:0;width:300px;height:100%;z-index:2;pointer-events:none;}
.brd_list::before{left:0;background:linear-gradient(to right,rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%);}
.brd_list::after{right:0;background:linear-gradient(to left,rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%);}

@media (max-width: 1680px){
    #n_brand::before{width: 150%;}
}
@media (max-width: 1280px){
    #n_brand::before{font-size: 15rem; line-height: 15rem; width: 150%;}
    .brd_list li{margin: 0 10px;}
    .brd_list li img{max-width: 300px;}
    .brd_list li h3{font-size: 2rem;}
    .brd_list li p{font-size: 2rem;}
    br.br1280{display: block;}
    .brd_list::before,.brd_list::after{width:20%;}
}
@media (max-width: 680px){
    #n_brand::before{font-size: 10rem; line-height: 8rem; bottom: -20px;}
    #n_brand #mTitle h3{margin-bottom: 50px;}
    .brd_list li{margin: 0 10px;}
    .brd_list li img{max-width: 300px;}
    .brd_list li h3{font-size: 2rem; line-height: 2rem;}
    .brd_list li p{font-size: 2rem;}
    br.br1280{display: block;}
}
@media (max-width: 480px){
    #n_brand #mTitle h3{font-size: 5rem;}
    .brd_list li img{max-width: 260px;}
    .brd_list li h3{font-size: 1.8rem;}
    .brd_list li p{font-size: 1.8rem;}
}


.m_big{display: flex; gap: 55px; flex-wrap: wrap;}
.m_big li{width: calc(100%/4 - 165px/4); overflow: hidden; transition: 0.3s;}
.m_big li > div{border-radius: 10px; overflow: hidden; transition: 0.3s;}
.m_big li:hover .img{transform: scale(1.1); transition: 0.3s;}
.m_big li .img{transition: 0.3s; width: 100%; height: 200px;}
.m_big li .img img{width: 100%; }
.m_big li:nth-child(1) .img img{transform: translateY(-25%);}
.m_big li:nth-child(3) .img img{transform: translateY(-18%);}
.m_big li:nth-child(4) .img img{transform: translateY(-15%);}
.m_big li .txt{position: relative; width: 100%;}
.m_big li .txt img{width: 100%;}
.m_big li .txt .crt{position: absolute; right: 0;bottom: 0; width: 53%;}
.m_big li .txt .crt img{width: 100%;}
.m_big li .cont{text-align: center; margin-top: 20px;}
.m_big li .cont h3{font-family: 'poppins'; color: #502d1f; font-size: 2.6rem; line-height: 2.6rem;}
.m_big li .cont p{color: #3e3e3e; font-size: 1.6rem;margin-top: 20px;}


@media (max-width: 1280px){
    .m_big{gap: 25px;}
    .m_big li{width: calc(100%/4 - 75px/4);}
    .m_big li .cont{margin-top: 20px;}
    .m_big li .cont h3{font-size: 2.3rem; line-height: 2.5rem;}
    .m_big li .cont p br{display: none;}
    .m_big li .img img{transform: translateY(0%);}
    .m_big li:nth-child(1) .img img{transform: translateY(-10%);}
    .m_big li:nth-child(3) .img img{transform: translateY(-10%);}
    .m_big li:nth-child(4) .img img{transform: translateY(-10%);}
}
@media (max-width: 1080px){
    .m_big li:nth-child(1) .img img{transform: translateY(0%);}
    .m_big li:nth-child(3) .img img{transform: translateY(0%);}
    .m_big li:nth-child(4) .img img{transform: translateY(0%);}
}
@media (max-width: 980px){
    .m_big li .img{height: 100%;}
    .m_big li .cont h3{font-size: 2rem; line-height: 2rem;}
    .m_big li .cont p{font-size: 1.5rem;}
}
@media (max-width: 880px){
    .m_big li{width: calc(100%/2 - 25px/2);}
}
@media (max-width: 480px){
    .m_big{gap: 20px 10px;}
    .m_big li{width: calc(100%/2 - 5px); border-radius: 5px;}
    .m_big li .cont{margin-top: 15px;}
    .m_big li .cont h3{font-size: 2rem; line-height: 2rem;}
    .m_big li .cont p{font-size: 1.5rem;margin-top: 10px;}
}


.m_mini{display: flex; gap: 10px; justify-content: space-between; margin-top: 40px; text-align: center;}
.m_mini.w5,
.m_mini.w3{justify-content: start; gap: 50px 10px; flex-wrap: wrap;}
.m_mini li:hover .img{transform: translateY(-10%); transition: 0.3s;}
.m_mini .img{width: 100%; max-width: 229px; margin: 0 auto; transition: 0.3s;}
.m_mini li{width: calc(100%/6 - 50px/6);}
.m_mini.w5 li{width: calc(100%/7 - 60px/7) !important;}
.m_mini.w3 li{width: calc(100%/4 - 30px/4) !important;}
.m_mini.w5 .img{max-width: 160px;}
.m_mini.w3 .img{max-width: 160px;}
.m_mini .img img{width: 100%;}
.m_mini .txt{width: 100%;}
.m_mini p{margin-top: 10px; font-family: 'poppins'; font-size: 1.8rem; font-weight: 500;color: #502d1f; letter-spacing: -0.03em; display: block;}
.m_mini.w5 p{font-size: 1.3rem;}
.m_mini.w3 p{font-size: 1.3rem;}

@media (max-width: 1600px){
    .m_mini{justify-content: center; gap: 30px 10px;}
}
@media (max-width: 1400px){
    .m_mini.w5,
    .m_mini.w3{gap: 20px 10px}
    .m_mini.w5 li{width: calc(100%/11 - 100px/11) !important;}
    .m_mini.w3 li{width: calc(100%/12 - 110px/12) !important;}
}
@media (max-width: 1280px){
    .m_mini.w5,
    .m_mini.w3{gap: 30px 10px}
    .m_mini.w5 li{width: calc(100%/4 - 30px/4);}
    .m_mini p{font-size: 1.6rem;}
}
@media (max-width: 980px){
    .m_mini.w5 li{width: calc(100%/6 - 50px/6) !important;}
    .m_mini.w3 li{width: calc(100%/6 - 50px/6) !important;}
    .m_mini.w5 p{font-size: 1.3rem;}
    .m_mini.w3 p{font-size: 1.3rem;}
    .m_mini p{font-size: 1.4rem;}
}
@media (max-width: 880px){
    .m_mini p{font-size: 1.6rem;}
    .m_mini.w5 li{width: calc(100%/4 - 30px/4) !important;}
    .m_mini.w3 li{width: calc(100%/4 - 30px/4) !important;}
    .m_mini{flex-wrap: wrap;}
    .m_mini li{width: calc(100%/3 - 20px/3);}
}
@media (max-width: 680px){
    .m_mini{gap: 30px 20px; margin-top: 40px;}
    .m_mini li{width: calc(100%/2 - 10px);}
    .m_mini p{font-size: 1.5rem;}
    .m_mini.w3 li{width: calc(100%/3 - 20px/3) !important;gap: 20px 10px;}
    .m_mini.w5 p{font-size: 1.2rem; margin-top: 0;}
    .m_mini.w3 p{font-size: 1.2rem;}
}


.m_flex{display: flex; gap: 50px;}
.m_flex .bk{width: 65%;}
.m_flex .bk .top{display: flex; align-items: center; justify-content: center; background: #502d1f; height: 60px;}
.m_flex .bk .top img{ width: 77px;}
.m_flex .bv .top img{width: 118px;}
.m_flex .dd{width: 37%;}
.m_flex .dd .top{display: flex; align-items: center; justify-content: center; background: #aca396; height: 60px;}
.m_flex .dd .top img{ width:162px;}
.m_flex .etc .top img{width: 39px;}
.yes1400{display: none !important;}

.bv2{width: 100%;}
.bv2 .top{display: flex; align-items: center; justify-content: center; background: #502d1f; height: 60px;}
.bv2 .top img{max-width: 189px;}


@media (max-width: 1400px){
    .m_flex{flex-wrap: wrap;gap: 30px;}
    .m_flex .bv{width: 100%;}
    .m_flex .etc{width: 100%;}
    .m_flex .bk{width: 100%;}
    .m_flex .dd{width: 100%;}
    .no1400{display: none;}
    .yes1400{display: block !important;}
}
@media (max-width: 980px){
    .m_flex{flex-wrap: wrap;}
}
@media (max-width: 680px){
    .m_flex .bk .top{height: 50px;}
    .m_flex .bk .top img{ width: 65px;}
    .m_flex .bv .top img{width: 90px;}
    .m_flex .dd .top{height: 50px;}
    .m_flex .dd .top img{ width: 140px;}
    .m_flex .etc .top img{width: 30px;}
    .bv2 .top{height: 50px;}
    .bv2 .top img{max-width: 160px;}
}


.drink{display: flex; gap: 20px; margin-top: 40px;}
.drink .img{overflow: hidden; transition: 0.3s; height: 140px;}
.drink .img:hover img{transform: scale(1.1) translateY(-30%); transition: 0.3s;}
.drink .img img{transition: 0.3s; transform: translateY(-30%);}
.drink h3{text-align: center; margin: 20px 0; color: #502d1f; font-size: 3rem; font-family: 'poppins'; font-weight: 600;}

.drink2{display: flex; gap: 50px; margin-top: 50px;}
.drink2 li{width: calc(100%/3 - 100px/3); position: relative; overflow: hidden; height: 300px;}
.drink2 li:hover .img{transform: scale(1.1); transition: 0.3s;}
.drink2 li .img{width: 100%; transition: 0.3s;}
.drink2 li .img img{width: 100%;}
.drink2 li h3{color: #fff; font-size: 3rem; font-family: 'poppins'; position: absolute; top: 20px; left: 30px;}

.etc2{width: 100%;margin-top: 30px;}
.etc2 .cont {display: flex;width: 100%; gap: 50px;}
.etc2 .lt {width: 67%;}
.etc2 .lt ul{display: flex; align-items: center;text-align: center; justify-content: space-between; height: 205px;}
.etc2 .lt ul .img{width: 60px; margin: 0 auto; transition: 0.3s;}
.etc2 .lt ul li:hover .img,
.etc2 .lt ul li.active .img {width: 120px;}
.etc2 .lt ul li .img {width: 60px;transition: 0.3s;}
.etc2 .lt ul li.active .img { width: 120px;}
.etc2 .lt ul p{font-size: 1.3rem; font-family: 'poppins';color: #5f4433; font-weight: 500; margin-top: 10px; letter-spacing: -0.07em; text-align: center;}
.etc2 .rt {width: 33%;display: flex;}
.etc2 .rt >div {width: 50%;}
.etc2 .rt >div .img{max-width: 160px;margin: 0 auto;}
.etc2 .rt >div .img img{width: 100%;}
.etc2 h4{font-family: 'poppins'; color: #502d1f; font-weight: 600; font-size: 2.2rem; margin-bottom: 10px;}

.m_etc{margin-top: 40px;}
.m_etc h4{font-family: 'poppins'; color: #502d1f; font-weight: 600; font-size: 2.2rem;}
.m_etc .box{display: flex; width: 30%;}
.m_etc .box > div{width: 50%;}
.m_etc .box > div .img{text-align: center; margin-top: 20px; transition: 0.3s;}
.m_etc .box > div .img:hover{transform: translatey(-10%); transition: 0.3s;}
.m_etc .box > div img{max-width: 120px;}



.icecream-wrap {display: flex;align-items: flex-start;gap: 20px; align-items: center; width: 70%;}
.icecream-wrap p{font-size: 1.3rem; font-family: 'poppins';color: #5f4433; font-weight: 500; margin-top: 20px; letter-spacing: -0.07em;}
.left-big {text-align: center; transition: 0.3s;}
.left-big:hover .img{ transform: translateY(-5%); transition: 0.3s;}
.left-big .img{ transition: 0.3s;}
.left-big .img img {width: 160px;}
.right-grid {display: flex; gap: 20px 5px; padding: 0;margin: 0; flex-wrap: wrap;}
/* .right-grid {display: grid;grid-template-columns: repeat(4, 1fr);gap: 20px 5px;list-style: none;padding: 0;margin: 0;} */
.right-grid li {text-align: center; transition: 0.3s; width: calc(100%/5 - 20px/5);}
.right-grid li:hover .img{transform: translateY(-10%); transition: 0.3s;}
.right-grid li .img{transition: 0.3s;}
/* .right-grid li:first-child {display: none;} */
.right-grid .img img {width: 50px;}


.menu_list { list-style: none; padding: 0; margin: 0; font-family: sans-serif; font-size: 1.5rem; font-family: 'poppins';color: #502d1f; font-weight: 500; padding: 0 20px;}
.menu_list li { display: flex; align-items: center; margin-bottom: 8px; }
.menu_list .item { white-space: nowrap; }
.menu_list .dot-line { flex-grow: 1; border-bottom: 1px solid #5f4433; height: 1px; margin: 0 8px; }
.menu_list .price { white-space: nowrap; }
.coming{padding: 20px;}
.coming p{background: #502c1d; color: #fffcf5; font-family: 'poppins'; font-style: italic; font-size: 1.5rem; text-align: center; line-height: 40px;}


@media (max-width: 1600px){
    .left-big .img img {width: 10vw;}
    .right-grid .img img {width: 4vw;}
    .menu_list {font-size: 1.4rem; padding: 0 10px; letter-spacing: -0.05em;}
    .m_etc .box > div img{max-width: 12vw;}
    .coming{padding: 10px;}

    .drink2 li{height: auto;}
}

@media (max-width: 1400px){
    .drink{margin-top: 50px;}
    .drink > li{width: calc(100%/3);}
    .m_etc{margin-top: 50px;}
    .left-big {display: none;}
    .right-grid {grid-template-columns: repeat(9, 1fr); width: 100%; margin-top: 20px;}
    .right-grid li:first-child {display: block;}
    .right-grid .img img {width: 7vw;}
    .right-grid li {width: calc(100%/9 - 40px/9);}
    
    .drink2{gap: 20px;margin-top: 30px;}
    .drink2 li{width: calc(100%/3 - 40px/3);}
    .drink2 li h3{font-size: 2.5rem; top: 10px; left: 20px;}
    .etc2 .lt ul{height: 175px;}
    .etc2 .lt ul .img{width: 50px;}
    .etc2 .lt ul li:hover .img,
    .etc2 .lt ul li.active .img {width: 100px;}
    .etc2 .lt ul li .img {width: 50px;}
    .etc2 .lt ul li.active .img { width: 100px;}
    .etc2 .rt >div .img{max-width: 130px;}
    .etc2 h4{font-size: 1.8rem;}
}
@media (max-width: 980px){
    .drink{gap: 10px;}
    .drink h3{font-size: 2.5rem;}
    .right-grid .img img {width: 10vw;}
    .m_etc .box > div img{max-width: 15vw;}
    .right-grid li {width: calc(100%/5 - 20px/5);}
    
    .etc2 .cont{flex-wrap: wrap;}
    .etc2 .lt {width: 100%;}
    .etc2 .rt {width: 100%;}
}
@media (max-width: 880px){
    .drink2{flex-wrap: wrap;}
    .drink2 li{width: 100%;height: 300px;}

    .etc2 .lt ul{flex-wrap: wrap; gap: 20px 0; height: 100%;}
    .etc2 .lt ul .img{width: 80px;}
    .etc2 .lt ul li{width: calc(100%/4);}
    .etc2 .lt ul li:first-child{width: 100%; margin: 0 auto;}
}
@media (max-width: 780px){
    .drink{flex-wrap: wrap; margin-top: 20px; gap: 20px;}
    .drink > li{width: 100%;}
    .m_etc{margin-top: 20px;}
    .m_etc h4{font-size: 1.8rem;}
    .right-grid .img img {width: 15vw;}
    .m_etc .box > div img{max-width: 20vw;}
    .drink h3{margin: 5px 0;}
    .menu_list li {margin-bottom: 0px; }
    .right-grid li {width: calc(100%/3 - 10px/3);}

    .etc2 .lt ul{height: 450px;}
}
@media (max-width: 480px){
    .m_flex{gap: 30px;}
    .right-grid .img img {width: 20vw;}
    .m_etc .box > div img{max-width: 25vw;}
    
    .drink2 li{height: 200px;}
    .etc2 .lt ul .img{width: 60px;}
    .etc2 .rt >div .img{max-width: 120px;}

    .etc2 .lt ul{gap: 0; height: 380px;}
    .etc2 .lt ul li{height: calc(100%/3);display: flex; align-items: center;justify-content: center; flex-wrap: wrap;align-content: center;}
    .etc2 .lt ul li p{width: 100%; text-align: center;}
    .etc2 .lt ul .img{width: 50px;}
    .etc2 .lt ul li:hover .img,
    .etc2 .lt ul li.active .img {width: 80px;}
    .etc2 .lt ul li .img {width: 50px;}
    .etc2 .lt ul li.active .img { width: 80px;}
}


.md{display: flex; gap: 50px; letter-spacing: -0.05em;}
.md > div{width: 50%; position: relative; border-radius: 10px; overflow: hidden;}
.md > div > .img{transition: 0.3s; height: 280px;}
.md > div:hover > .img{transform: scale(1.1); transition: 0.3s;}
.md .stk{position: absolute; width: 167px; right: 70px; top: 0; z-index: 999;}
.md .txt{position: relative; background: #ffdd84; display: flex; align-items: center; padding: 10px; justify-content: end;}
.md .rt .txt{background: #502d1f;}
.md .txt h3{font-family: 'poppins'; color: #502d1f; font-size: 2.5rem; font-weight: 600;}
.md .rt .txt h3{color: #ffdd84;}
.md .rt > .img img{transform: translateY(-9%);}
.md .txt .img{width: 150px; position: absolute; bottom: 20px; left: 30px;}
.md .txt .cont{padding-left: 15px;margin-left: 15px; border-left: 1px solid #502d1f;}
.md .rt .txt .cont{border-left: 1px solid #ffdd84;}
.md .txt .cont p{color: #502d1f; font-size: 1.3rem; line-height: 1.8rem;}
.md .rt .txt .cont p{color: #ffdd84;}

@media (max-width: 1500px){
    .md .txt{flex-wrap: wrap;}
    .md .txt h3{text-align: right;}
    .md .txt .cont{border-left: 0; width: 100%; text-align: right;}
    .md .rt .txt .cont{border-left: 0;}
    .md .txt .img{width: 13vw;}
    .md > div > .img{height: 200px;}
}
@media (max-width: 1280px){
    .md{gap: 20px;}
    .md .stk{width: 10vw; right: 25px;}
    .md .txt h3{font-size: 2.5rem; margin-bottom: 10px;}
    .md > div > .img{height: 160px;}
    .md .rt > .img img{transform: translateY(-20%);}
}
@media (max-width: 980px){
    .md .rt > .img img{transform: translateY(-10%);}
}
@media (max-width: 880px){
    .md{flex-wrap: wrap;}
    .md > div{width: 100%;}
    .md .stk{width: 20vw; }
    .md .txt .img{width: 23vw;}
    .md > div > .img{height: auto;}
    .md .rt > .img img{transform: translateY(0%);}
}
@media (max-width: 680px){
    .md .stk{width: 25vw; }
    .md .txt .img{width: 30vw; left: 20px;}
}
@media (max-width: 480px){
    .md .txt{padding: 10px 20px 20px;}
    .md .txt h3{font-size: 2rem; margin-bottom: 5px;}
    .md .txt .cont p{font-size: 1.1rem; line-height: 1.5rem;}
    .md .txt .img{width: 25vw;}
}

.md2{margin-top: 30px; background: #fff; border-radius: 10px; padding: 30px;}
.md2 h4{text-align: center; font-family: 'poppins'; font-size: 3rem; color: #502c1d;}
.md_list{display: flex; justify-content: space-between; margin-top: 30px;}
.md_list li .img{margin-bottom: 15px; transition: 0.3s;text-align: center;}
.md_list li:hover .img{transform: scale(1.1); transition: 0.3s;}
.md_list li .img img{max-width: 130px;}
.md_list li .txt h3{color: #502d1f; font-family: 'poppins'; font-size: 1.8rem; display: flex; justify-content: space-between; font-weight: 500; letter-spacing: -0.05em;}
.md_list li .txt h3 span{margin-left: 10px;}
.md_list li .txt div{color: #3e3e3e; font-size: 1.3rem;  padding-left: 10px; border-left: 1px solid #502c1d; margin-top: 10px;}
.md_list li .txt div p + p{margin-top: 5px;}


@media (max-width: 1580px){
    .md_list{gap: 10px;}
    /* .md_list li{width: calc(100%/3 - 200px/3);} */
    .md_list li .txt h3{flex-wrap: wrap; font-size: 1.4rem;}
    .md_list li .txt h3 span{width: 100%; text-align: right;}
    .md_list li .txt div{font-size: 1.1rem;}
}
@media (max-width: 1280px){
    .md_list{gap: 50px;}
    .md_list li{width: calc(100%/3 - 100px/3);}
}
@media (max-width: 1024px){
    .md_list li .txt h3{font-size: 1.8rem;}
    .md_list{gap: 30px; flex-wrap: wrap;}
    .md_list li{width: calc(100%/3 - 60px/3);}
}
@media (max-width: 880px){
    .md_list li{width: calc(100%/2 - 15px);}
    .md2{margin-top: 0;}
}
@media (max-width: 560px){
    .md_list li .txt h3{font-size: 1.5rem;}
    .md_list li .txt div{font-size: 1.1rem;}
}
@media (max-width: 480px){
    .md_list li .txt h3{flex-wrap: wrap;}
    .md_list li .txt h3 span{width: 100%; margin-left: 0;}
}


.menu_mo{display: none !important;}
@media (max-width: 880px){
    .menu_pc{display: none !important;}
    .menu_mo{display: block !important;}
}


.brd_list2{display: flex; flex-wrap: wrap; gap: 20px;}
.brd_list2 li{width: calc(100%/5 - 80px/5); border: 1px solid #ddd; background: #fff; border-radius: 10px; overflow: hidden;padding: 30px; position: relative; display: flex; align-items: center; justify-content: center; transition: 0.3s;height: 160px;}
.brd_list2 li img{width: 100%; transition: 0.3s;}
.brd_list2 li .txt{display: none; transition: 0.3s;}
.brd_list2 li:hover{background: #f5b335; transition: 0.3s;}
.brd_list2 li:hover .txt{display: block; transition: 0.3s; color: #222;}
.brd_list2 li:hover img{display: none; transition: 0.3s;}
.brd_list2 li h3{margin-bottom: 15px; font-size: 2rem; color: #222; position: relative;}
.brd_list2 li h3::before{content: '-'; position: absolute; left: 50%; color: #222; font-family: 'jost'; font-size: 2rem; bottom: -20px; font-weight: normal; transform: translateX(-50%);}
.brd_list2 li p{font-size: 1.8rem; color: #222;}

@media (max-width: 1280px){
    .brd_list2 li{height: 140px;}
    .brd_list2 li h3{font-size: 1.8rem;}
    .brd_list2 li p{font-size: 1.6rem;}
}
@media (max-width: 1080px){
    .brd_list2 li{width: calc(100%/4 - 60px/4); padding: 10px;}
}
@media (max-width: 880px){
    .brd_list2 li{height: 100px;}
    .brd_list2 li h3{font-size: 1.6rem;}
    .brd_list2 li p{font-size: 1.5rem;}
}
@media (max-width: 680px){
    .brd_list2 li{width: calc(100%/3 - 40px/3);border-radius: 5px;}
}
@media (max-width: 480px){
    .brd_list2{gap: 10px;}
    .brd_list2 li{width: calc(100%/2 - 5px);}
    .brd_list2 li h3{font-size: 1.4rem;}
    .brd_list2 li p{font-size: 1.3rem;}
}