@charset "utf-8";

/*
font-family: 'Belanosima', sans-serif;
font-family: 'cafe24';
font-family: 'MADE TOMMY';
*/

*{margin: 0; padding: 0; box-sizing: border-box;}
body, html{width: 100%;  height: 100%; font-size: 17px; font-family: 'Pretendard', sans-serif !important; position: relative; color: #000; font-weight: 400; scroll-behavior: smooth; }
body.on, html.on{height: 100%; overflow: hidden;}
ol, ul, li{list-style: none; margin: 0; padding: 0;}
a{display: block; text-decoration: none; color: inherit;}
p, span, i, em{word-break: keep-all;}
body, p, h1, h2, h3, h4, h5, h6, div, header, section, article, footer, nav, aside, address, figure, dl, dt, dd, form, input, select{margin: 0; padding: 0;}
i, em, address{font-style: normal;}
table {border-collapse: collapse; border-spacing: 0;}
button{padding: 0; background-color: transparent; border: none;}
img{display: block;}

.pc{display: block;}
.tablet{display: none;}
.mob{display: none;}

#wrap{width: 100%; height: auto; overflow: hidden;}
.move{opacity: 0;}

.light{font-weight: 300;}
.medium{font-weight: 500;}
.semibold{font-weight: 600;}
.bold{font-weight: 700;}
.extrabold{font-weight: 800;}
.black{font-weight: 900;}

.white{color: #fff;}
.blue{color: #29398c;}
.upper{text-transform: uppercase;}

.bela{font-family: 'Belanosima', sans-serif;}
.cafe24{font-family: 'Cafe24ClassicType-Regular';}
.tommy{font-family: 'MADE TOMMY';}

/*초기화 완료*/

/*header*/
#header{position: absolute; left: 0; top: 0; width: 100%; padding-top: 38px; height: auto; z-index: 99; background: transparent; transition: all 0.4s;}
#header_inner{position: relative; width: 100%; display: flex; justify-content: center; align-items: center; gap: 80px;}
#header_inner > div{}
#header_inner .logo{position: relative; width: 100px; max-width: 100px; z-index: 99;}
#header_inner .logo img{width: 100%;}

#header_inner .gnb{display: flex; gap: 80px;}
#header_inner .gnb > li{position: relative;}
#header_inner .gnb > li:last-child{margin: 0;}
#header_inner .gnb > li > a{display: inline-block; position: relative; font-size: 1.2rem; color: #000; text-transform: uppercase; transition: all 0.4s;}
#header_inner .gnb > li > a:hover{color: #d6a452;}

#header_inner .gnb > li > .sub_nav{display: block; position: absolute; left: 50%; top: 37px; transform: translate(-50%, 0); width: 150px; height: auto; background: #fff; padding: 10px 0; opacity: 0; z-index: -9; transition: all 0.4s;}
#header_inner .gnb > li > .sub_nav::before{content: ''; position: absolute; left: 50%; top: 0; transform: translate(-50%, 0) scaleX(0); width: 100%; height: 2px; background: #d6a452; transition: all 0.4s; z-index: 1;}
#header_inner .gnb > li:hover > .sub_nav::before{transform: translate(-50%, 0) scaleX(100%);}
#header_inner .gnb > li:hover > .sub_nav{opacity: 1; z-index: 9;}
#header_inner .gnb > li > .sub_nav > li{text-align: center;}
#header_inner .gnb > li > .sub_nav > li > a{display: block; padding: 7px 0; position: relative; font-size: 0.95rem; color: #000; transition: all 0.4s; text-transform: uppercase;}
#header_inner .gnb > li > .sub_nav > li > a:hover{color: #d6a452;}

.scroll{position: relative;}
.scroll .scroll_bar{width: 1px; height: 108px; background: #d1d1d2;}
.scroll .scroll_bar .move_bar{width: 1px; height: 40%; background: #000; animation: h_scroll 2s linear infinite;}
.scroll > p{position: relative; left: -50%; margin: 30px 0 0; font-size: 0.85rem; text-align: center;}
@keyframes h_scroll{
  0%{
    transform: translateY(0);
    opacity: 0;
  }
  100%{
    transform: translateY(150%);
    opacity: 1;
  }
}

.lang a {transition: all .4s; line-height: 30px;}
.lang a:hover {color: #d6a452;}

.go_shop{position: absolute; left: 27%; top: 65%; width: 107px; height: 46px; background: #d6a452; border-radius: 24px; text-align: center;}
.go_shop::before{content: ''; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 90%; height: 78%; border-radius: 20px; border: 1px solid #fff;}
.go_shop a{font-size: 1.2rem; font-weight: 600; color: #fff; text-transform: uppercase; line-height: 46px;}

.menu_icon{display: none; margin: 14px 0 0; width: 40px; height: auto; text-align: center; z-index: 99; position: relative; cursor: pointer;}
.menu_icon #nav-icon{position: relative; width: 100%; font-size: 0;}
.menu_icon #nav-icon .hamburger_txt{font-size: 0.8rem; margin-top: 7px; color: #000;}
.hamburger{width: 100%; height: 26px; position: relative; display: inline-block; vertical-align: middle;}
.menu_icon #nav-icon span{display: block; position: absolute; left: 0; width: 100%; height: 2px; background: #000; transition: all 0.4s;}
.menu_icon #nav-icon span:nth-child(1){top: 0;}
.menu_icon #nav-icon span:nth-child(2){top: 50%; transform: translate(0, -50%);}
.menu_icon #nav-icon span:nth-child(3){bottom: 0;}
.menu_icon #nav-icon.open span{background: #fff;}
.menu_icon #nav-icon.open span:nth-child(1){left: 0; top: 5px; transform: rotate(45deg);}
.menu_icon #nav-icon.open span:nth-child(2){opacity: 0;}
.menu_icon #nav-icon.open span:nth-child(3){position: absolute; left: 0; bottom: 19px;  transform: rotate(-45deg);}
.menu_icon #nav-icon.open .hamburger_txt{color: #fff;}

.nav_box2{display: none; position: fixed; left: 0; top: 0; transform: translateY(-100%); width: 100%; height: 100vh; background: #fff; z-index: 9; transition: all 0.4s;}
.nav2_wrap{position: relative; width: 100%; height: 100%;}
.nav_box2 .nav_box2_cont{position: absolute; right: 0; top: 0; width: 45%; height: 100%; background: #000;}
.nav_box2 .nav_box2_cont .nav_box2_wrap{position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 100%;}
.nav_box2 .nav_box2_cont ul{width: 75%; margin: auto; font-size: 0;}
.nav_box2 .nav_box2_cont ul > li.sub_navbox{position: relative; margin: 0 0 70px 0; width: 100%; font-size: 0; text-align: left;}
.nav_box2 .nav_box2_cont ul > li.sub_navbox:last-child{margin: 0;}
.nav_box2 .nav_box2_cont ul > li.sub_navbox > p{display: inline-block; width: 25%; vertical-align: top; position: relative; font-weight: 500; font-size: 1.5rem; color: #fff;}
.nav_box2 .nav_box2_cont ul > li.sub_navbox > ul{display: inline-block; width: 75%; vertical-align: top; font-size: 0;}
.nav_box2 .nav_box2_cont ul > li.sub_navbox > ul > li{display: inline-block; width: calc(100%/3); margin: 0 0 25px 0; vertical-align: middle;}
.nav_box2 .nav_box2_cont ul > li.sub_navbox > ul > li.bot{width: calc(100%/3*2);}
.nav_box2 .nav_box2_cont ul > li.sub_navbox > ul > li > a{font-size: 1.2rem; font-weight: 300; color: #fff; opacity: 0.6; transition: all 0.4s;}
.nav_box2 .nav_box2_cont ul > li.sub_navbox > ul > li > a:hover{opacity: 1;}
.nav_box2.open{transform: translateY(0);}
.nav_box2.open > img{display: block;}
.nav_box2_bg{position: relative; width: 55%; height: 100%; overflow: hidden;}
.nav_box2_bg img{position: absolute; left: 0; top: 50%; transform: translate(0, -50%); width: 105%;}
#layout{width: 100%;}

/*footer*/
.footer{position: relative; width: 100%; height: auto; padding: 0 0 100px; background: #000;}
.f_inner{margin: auto; width: 85%;}
.f_inner .top{padding: 35px 0 100px; width: 100%;}
.f_inner .top .f_nav{width: 100%; font-size: 0; text-align: end;}
.f_inner .top .f_nav > li{display: inline-block; position: relative; vertical-align: top; text-align: center; padding-right: 2vw; margin-right: 2vw;}
.f_inner .top .f_nav > li:last-child{padding: 0; margin: 0;}
.f_inner .top .f_nav > li::after{content: ''; position: absolute; right: 0; top: 50%; transform: translate(0, -50%); width: 2px; height: 15px; background: #fff;}
.f_inner .top .f_nav > li:last-child::after{display: none;}
.f_inner .top .f_nav > li a{font-size: 0.95rem; color: #fff; text-transform: uppercase;}
.f_inner .bot{width: 100%; font-size: 0; overflow: hidden;}
.f_inner .bot > div{float: left;}
.f_inner .bot .f_logo{width: 113px; max-width: 113px;}
.f_inner .bot .f_logo img{width: 100%;}
.f_inner .bot .f_info_wrap{font-size: 0; padding-left: 7%;}
.f_inner .bot .f_info_wrap > .f_info{display: inline-block; margin-right: 25px; vertical-align: middle; font-size: 1rem; letter-spacing: -0.03em;}
.f_inner .bot .f_info_wrap > .f_info .s_bold{font-weight: 600; margin-right: 7px;}
.f_inner .bot .f_info_wrap > .f_info.block{display: block; margin: 10px 0 24px;}
.f_inner .bot .f_info_wrap > .copyright{font-size: 0.95rem; font-weight: 300; color: #a6a6a6;}
.f_inner .bot .tel_wrap{float: right;}
.f_inner .bot .tel_wrap > .tel{position: relative; float: left; color: #fff;}
.f_inner .bot .tel_wrap > .tel:first-child{padding-right: 40px;}
.f_inner .bot .tel_wrap > .tel:first-child::after{content: ''; position: absolute; right: 0; bottom: 5px; width: 4px; height: 25px; background: #fff;}
.f_inner .bot .tel_wrap > .tel:last-child{padding-left: 40px;}
.f_inner .bot .tel_wrap > .tel span{display: block;}
.f_inner .bot .tel_wrap > .tel .small{font-size: 1rem; letter-spacing: -0.03em;}
.f_inner .bot .tel_wrap > .tel .big{font-size: 2rem; letter-spacing: -0.03em;}

/* main */
.main{width: 100%; position: relative;}
.crystal {width: 65px; position: absolute;}
.crystal01 {animation: cry01 1s .1s infinite alternate linear; transform: translateY(10px); bottom: -15%; left: 30%;}
@keyframes cry01 {
  0% {transform: translateY(-10px);}
  100% {}
}
.crystal02 {animation: cry02 1s .1s infinite alternate linear; transform: translateY(-10px); top: 5%; left: 20%;}
@keyframes cry02 {
  0% {transform: translateY(10px);}
  100% {}
}
.crystal03 {animation: cry03 1s .1s infinite alternate linear; transform: translateY(10px); top: 25%; right: 15%;}
@keyframes cry03 {
  0% {transform: translateY(-10px);}
  100% {}
}
.crystal img {width: 100%;}

/* m1 */
.m1{width: 100%; height: 800px;}
.m1 .swiper-container{width: 100%; height: 100%;}
.m1 .swiper-container .swiper-slide{width: 100%; height: 100%; position: relative;}
.m1 .swiper-container .swiper-slide .img_wrap{width: 100%; position: relative;}
.m1 .swiper-container .swiper-slide .img_wrap img{width: 100%;}
.m1 .swiper-container .swiper-slide .img_wrap .cat{position: absolute; left: 55.2%; top: 71%; width: 5.8%; z-index: 9;}
.m1 .swiper-container .swiper-slide .img_wrap .cat img.cat2{position: absolute; left: 18px; top: 24px; width: 25%; z-index: 9; animation: cat 1.5s step-end infinite;}
@keyframes cat {
  50% {
    opacity: 0;
  }
}
.m1 .swiper-container .swiper-slide .img_wrap .salt{position: absolute; left: 49.5%; top: 83%; z-index: 9; width: 7%;}
.m1 .swiper-container .swiper-slide .img_wrap .seaweed{position: absolute; left: 40.5%; top: 27%; width: 21%; z-index: 5;}

.m1 .swiper-container .swiper-slide .text_area{position: absolute; left: 50%; top: 35%; transform: translate(-50%, 0); width: 80%;}
.m1 .swiper-container .swiper-slide .text_area .tommy{font-size: 2.2rem; color: #d6a452;}
.m1 .swiper-container .swiper-slide .text_area .big{margin: 15px 0 0; font-size: 2.5rem; font-weight: 300; letter-spacing: -0.05em; }
.m1 .swiper-container .swiper-slide .text_area .big .medium{font-weight: 500;}

.m1_control{position: absolute; left: 50%; top: 63%; transform: translate(-50%, 0); width: 80%; z-index: 9;}
.swiper-progress-bar{position: relative; margin: 0 14px 0 0; width: 100px; display: inline-block; vertical-align: middle; z-index: 9; height: 2px;}
.swiper-progress-bar .slide_progress-bar{position: absolute; left: 0; right: 0; top: 10%; height: 2px; background: #e5e5e5; width: auto; clear: both; opacity: 0;}
.swiper-progress-bar .slide_progress-bar:after{content: ''; position: absolute; top: 0; left: 0; background: #000; height: 100%; width: 0; transition: 0.1s width linear;}
.swiper-progress-bar.active .slide_progress-bar{opacity: 1;}
.swiper-progress-bar.animate .slide_progress-bar:after{transition: width linear; transition-delay: unset; width: 100%; transition-duration: 3s;}
.m1_control .swiper-pagination{display: inline-block; vertical-align: middle; position: relative; bottom: auto; top: auto; left: auto; right: auto; width: auto; text-align: left; color: #b2b2b2; font-size: 0.8rem;}
.m1_control .swiper-pagination .swiper-pagination-current{color: #000;}

/* m2 */
.m2{margin: 18vh 0;}
.m2 .m2_wrap{width: 100%;}
.main_tit{font-size: 2.2rem; color: #000000; text-align: center;}
.m2 .swiper-container{margin: 75px 0 0; padding: 0 0 14vh 0; width: 100%; overflow: hidden;}
.m2 .swiper-container .swiper-wrapper{transition-timing-function: linear;}
.m2 .swiper-container .swiper-slide{width: auto !important; margin-right: 50px !important;}
.m2 .swiper-container .swiper-slide.m2_2, .m2 .swiper-container .swiper-slide.m2_4{margin: 0 0 -5vh 0 !important; align-self: flex-end;}
.m2 .swiper-container .swiper-slide.m2_4{margin-bottom: -12vh !important;}
.m2 .swiper-container .swiper-slide.m2_4{margin-right: 50px !important;}
.m2 .swiper-container .swiper-slide .slide_p{display: inline-block; margin: 15px 24px 0 0; vertical-align: top; font-size: 1.7rem; letter-spacing: -0.15em; writing-mode: vertical-rl;}
.m2 .swiper-container .swiper-slide .slide_img{display: inline-block; vertical-align: top;}
.m2 .swiper-container .swiper-slide.m2_1 .slide_p{margin: 15px -12px 0 0;}
.m2 .swiper-container .swiper-slide.m2_2 .slide_p, .m2 .swiper-container .swiper-slide.m2_4 .slide_p{margin: 0 24px 0 0;}

/* m3 */
.m3{}
.m3 .m3_obj01{display: none; position: absolute; left: 24%; top: 3%; width: 5.5%; z-index: -1;}
.m3 .m3_obj01 img{width: 100%;}
.m3 .m3_obj.m3_obj04{display: none; position: absolute; left: 30%; top: -8%; width: 10%;}
.m3 .m3_obj.m3_obj04 img{width: 100%;}
.m3 .m3_obj.m3_obj02{display: none; position: absolute; left: 62%; top: 15%; width: 4%;}
.m3 .m3_obj.m3_obj02 img{width: 100%;}
.m3 .m3_obj.m3_obj03{display: none; position: absolute; left: 40%; top: -15%; width: 5%;} 
.m3 .m3_obj.m3_obj03 img{width: 100%;}
.m3 .top{position: relative;}
.m3 .top .main_tit{display:block; text-align: center;}

.m3 .bot{position: relative; padding: 60px 0 4vh; margin: auto; width: 90%; max-width: 1320px; overflow: hidden;}
.m3 .swiper-container{width: 100%; overflow: visible;}
.m3 .swiper-container .swiper-wrapper{}
.m3 .swiper-container .swiper-slide{position: relative; padding: 0 5px 0 3px;}
.m3 .swiper-container .swiper-slide .slide_inner{position: relative;width: 100%; height: auto; padding: 55px 0 50px; background: #fff;border-radius: 20px;box-shadow: 0 0 10px rgba(0,0,0,0.1);display: inline-block;}
.m3 .swiper-container .swiper-slide .slide_inner p{text-align: center;}
.m3 .swiper-container .swiper-slide .slide_inner .pro_img{position: relative; width: 63%; margin: auto;}
.m3 .swiper-container .swiper-slide .slide_inner .pro_img img{width: 100%;}
.m3 .swiper-container .swiper-slide .slide_inner .pro_tit{margin: 15px 0; font-size: 1.35rem; font-weight: 500; letter-spacing: -0.05em;}
.m3 .swiper-container .swiper-slide .slide_inner .pro_desc{font-size: 0.95rem; letter-spacing: -0.07em; line-height: 1.4; color: #4d4d4d;}

.m3 .m3_cont{display: block; width: 100%;border-radius: 20px;}
.m3 .m3_cont .m3_cont_inner{position: relative;margin: auto;width: 100%; height: auto; padding: 32px 0; background: #fff;border-radius: 20px;box-shadow: 0 0 10px rgba(0,0,0,0.1);margin:30px auto 0;}
.m3 .m3_cont .m3_cont_inner::before{content: ''; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 94%; height: 76%; border: 1px solid #efda9a; border-radius: 13px;}
.m3 .m3_cont .m3_cont_inner .m3_txt{margin: auto;width: 80%;font-size: 1rem;font-weight: 300;letter-spacing: -0.07em;line-height: 1.4;}
.m3 .m3_cont .m3_cont_inner .m3_txt .medium{font-weight: 500;}

.m3_control{position: absolute; left: 50%; top: 51%; transform: translate(-50%, 0); width: 90%; max-width: 1520px; display: flex; justify-content: space-between;}
.m3_control .swiper-button-prev, .m3_control .swiper-button-next{position: static; color: #999999; background-image: none; width: auto; height: auto; margin: 0;}
.m3_control .swiper-button-prev{left: 0;}
.m3_control .swiper-button-next{right: 11%;}

/* m4 - sub_3_1로 변경 */
.m4{margin: 20vh 0 0; padding: 0 0 16vh 0; width: 100%; background: #efda9a; border-radius: 60px 0 0 60px;}
.m4 .m4_obj{position: absolute;}
.m4 .m4_obj img:first-child{width: 100%;}
.m4 .m4_obj img.mouse{position: absolute; left: 36%; top: 19%; z-index: -1; animation: mouse_move 1.5s linear infinite;}
@keyframes mouse_move {
  0%{
    transform: translate(0, 0) rotate(0);
  }
  50%{
    transform: translate(0, -5px) rotate(-10deg);
  }
  100%{
    transform: translate(0, 0) rotate(0);
  }
}
.m4 .m4_obj.m4_obj01{left: 24%; top: -11%; width: 16%;}
.m4 .m4_obj.m4_obj02{right: 26%; top: 10%; width: 4%;}
.m4 .m4_obj.m4_obj03{right: 4%; bottom: 0; width: 29%;}
.m4 .m4_bg{position: absolute; right: -1.5%; top: 6%;}
.m4 .m4_bg img{width: 100%;}

.m4 .m4_inner{position: relative; padding-left: 5%; width: 100%; z-index: 9;}
.main_tit_small{margin: 10px 0 0; font-size: 1.1rem; letter-spacing: -0.05em;}

.marker_slide{position: absolute; left: 45%; top: -7%; padding-bottom: 5vh; width: 467px; height: auto; overflow: visible;}
.marker_slide .swiper-wrapper{}
.marker_slide .swiper-wrapper .swiper-slide{opacity: 0 !important; transition: all 0.4s !important;}
.marker_slide .swiper-wrapper .swiper-slide.swiper-slide-active{opacity: 1 !important;}
.m4_marker{position: relative; width: 100%; height: 188px; background: #fff; border-radius: 32px; box-shadow: 0 0 10px rgba(0,0,0,0.1);}
.m4_marker::before{content: ''; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 92%; height: 80%; border: 1px solid #efda9a; border-radius: 20px;}
.m4_marker .marker_inner{position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 82%; margin: auto; font-size: 0;}
.m4_marker .marker_inner > div{display: inline-block; vertical-align: middle;}
.m4_marker .marker_inner .left{width: 30%; padding-right: 5%;}
.m4_marker .marker_inner .left img{width: 100%;}
.m4_marker .marker_inner .right{width: 70%;}
.m4_marker .marker_inner .right .medium{font-size: 1.3rem; letter-spacing: -0.05em; line-height: 1.3;}
.m4_marker .marker_inner .right .light{margin: 10px 0 0; font-size: 1rem; letter-spacing: -0.07em; line-height: 1.4;}
.m4_marker .marker_out{position: absolute; z-index: -1; left: 0; bottom: -30%;}

.m4_cont{margin: 45px 0 0 -2%; padding: 0 0 14vh 0;}
.m4_cont .swiper-container{width: 100%;}
.m4_cont .swiper-container .swiper-slide{position: relative;}
.m4_cont .swiper-container .swiper-slide .slide_bg{width: 100%;}
.m4_cont .swiper-container .swiper-slide .slide_bg img{width: 100%;}
.m4_cont .swiper-container .swiper-slide .slide_img{position: absolute; left: 50%; top: 8%; transform: translate(-50%, 0); width: 88%;}
.m4_cont .swiper-container .swiper-slide .slide_img img{width: 100%;}
.m4_cont .swiper-container .swiper-slide .slide_txt{margin: 7px 0 0; font-size: 1.1rem; letter-spacing: -0.05em; text-align: center;}
.m4_cont .pagination_progress{position: relative; margin: 37px 0 0 2%; height: 1px; background: #fff; width: 80%;}
.m4_cont .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{background: #29398c; height: 3px; top: -1px;}

/* m4 수정 */
.m4_changed{padding: 20vh 0 16vh; font-size: 0;}
.m4_changed .m4_changed_inner{}
.m4_changed .m4_changed_inner .main_tit{text-align: center; margin-bottom: 85px;}
/*
.m4_changed .left{width: 50%;}
.m4_changed .left > div{width: 100%;}
.m4_changed .left > .top{margin-bottom: 20px;}
.m4_changed .left > div img{width: 100%;}
*/
.m4_changed .right{position: absolute; left: 17%; top: 25%;}
.m4_changed .right .m4_txt{position: relative; font-size: 0;}
.m4_changed .right .m4_txt > span{display: inline-block; vertical-align: top;}
.m4_changed .right .m4_txt .m4_txt_ico{display: block; margin-top: 20px; padding-left: 70px;}
.m4_changed .right .m4_txt .m4_txt_ico img{display: inline-block; vertical-align: middle;}
.m4_changed .right .m4_txt .m4_txt_ico img:nth-child(1){width: 74px; margin-right: 27px;}
.m4_changed .right .m4_txt .m4_txt_ico img:nth-child(2){width: 92px;}
.m4_changed .right .m4_txt .txt_obj{margin-right: 15px;}
.m4_changed .right .m4_txt .txt{font-size: 1.7rem; letter-spacing: -0.05em; line-height: 1.3; padding-top: 22px;}
.m4_changed .m4_ico{width: 100%;}
.m4_changed .m4_ico .m4_img{position: relative; left: 50%; transform: translate(-50%, 0); width: 116%;}
.m4_changed .m4_ico .m4_img img{width: 100%;}

/* m5 */
.m5{padding: 0 0 22vh 0;}
.m5_cont{width: 90%; max-width: 1555px; margin: auto; font-size: 0;}
.m5_cont > div{display: inline-block; vertical-align: bottom;}
.m5_cont .left{width: 72%; margin-right: 2%;}
.m5_cont .m5_tit{display: block; margin-bottom: 45px;}
.m5_cont .m5_tit .main_tit{font-size: 1.7rem; text-align: left;}
.m5_cont .m5_tit .main_tit.main_tit2{letter-spacing: -0.05em; margin-top: 30px;}
.m5_cont .map{width: 100%; height: 595px; position: relative; border-radius: 20px; overflow: hidden;}
.m5_cont .map .map_inner{position: relative; width: 100%; height: 100%;}
.m5_cont .map .map_info{position: absolute; right: 0; top: 0; width: 30%; background: #595959; border-radius: 20px;}
.m5_cont .map .map_info::after{content: ''; display: block; padding-bottom: 100%;}
.m5_cont .map .map_info .map_info_inner1{position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 80%;}
.m5_cont .map .map_info .map_info_ico{position: absolute; right: 0; top: -23px;}
.m5_cont .map .map_info .name{font-size: 1.7rem; letter-spacing: -0.04em; margin-bottom: 30px;}
.m5_cont .map .map_info .address{font-size: 0.9rem; letter-spacing: -0.05em; line-height: 1.4;}
.m5_cont .map .map_info .tel{font-size: 1.5rem; letter-spacing: -0.05em; margin-top: 18px;}
.m5_cont .map .map_info .tel2{margin: 8px 0 15px;}

.m5_cont .right{width: 26%;}
.m5_cont .right .catalog{width: 100%; height: auto; background: #f5f5f5; border-radius: 20px;}
.m5_cont .right .catalog a{padding: 87px 0 42px;}
.m5_cont .right .catalog .catalog_img{margin: 0 auto 12px; width: 73%;}
.m5_cont .right .catalog .catalog_img img{width: 100%;}
.m5_cont .right .catalog .m5_list_inner{width: 70%; margin: auto; font-size: 0;}
.m5_cont .right .catalog .m5_list_inner > p{display: inline-block; vertical-align: middle;}
.m5_cont .right .catalog .m5_list_inner .m5_tit{width: 80%; margin: 0 auto;}
.m5_cont .right .catalog .m5_list_inner .m5_tit span{display: block;}
.m5_cont .right .catalog .m5_list_inner .m5_tit .big{font-size: 1.5rem;}
.m5_cont .right .catalog .m5_list_inner .m5_tit .small{font-size: 0.9rem; letter-spacing: -0.07em; margin-top: 8px;}
.m5_cont .right .catalog .m5_list_inner .m5_ico{width: 20%;}
.m5_cont .right .catalog .m5_list_inner .m5_ico img{width: 100%; transition: all 0.4s;}
.m5_cont .right .catalog.m5_quick{background: #000; margin-top: 20px;}
.m5_cont .right .catalog.m5_quick a{padding: 30px 0;}
.m5_cont .right .catalog a:hover .m5_list_inner .m5_ico img{transform: translateY(7px);}