* {padding:0; margin:0;box-sizing:border-box}

.swiper-button-prev:after,
.swiper-button-next:after {
font-size: 60px !important; 
}
.swiper-pagination-bullet-active {
background: #000 !important;}



#main{padding-top:80px}   

.visual{width:100%;}
.visual1{width:100%;background:url('/common/img/vi1.jpg') no-repeat center; background-size:cover;height:900px;}
.visual2{width:100%;background:url('/common/img/vi2.jpg') no-repeat center; background-size:cover;height:900px;}
.visual div.text{width:100%;text-align:left ;padding-top:250px}
.visual h1 {font-size:4.75rem;color:#181919;}
.visual .vi_text {font-size:32px;  line-height:1.2; margin:20px 0;font-weight:500;color:#181919}
.visual a {font-size:18px; width:160px;border-radius:100px;color:#fff !important;  background:#181919;display:block; line-height:40px; margin-top:40px; transition: all 0.3s ease-out;text-align:center;padding:0 5px;}
.visual a:hover {background-color:#fff; color:#000 !important;}


.swiper-pagination2 {
display:none
}



.subject{text-align:center; font-size: 2.6vw; font-weight: 500; margin:0 0 5% 0; width:100%; display:inline-block; } 
.inner{width:74.75%;margin:0 auto;}


.product{width:100%;padding:10.42% 0 7.81% 0;}
.product .more{text-align:center;float:right;background:#000; border-radius:70px;padding:12px 0px;margin:-4% 0 2% 0;color:#fff; border-radius:100px;padding:12px 20px; font-size:1rem}
.more img{vertical-align:-.3px;padding-left:6px;}
.product ul{width:100%;overflow:hidden;}
.product ul:last-child li{margin-bottom:0;}
.product ul li{width:23.73%; float:left;margin-right:1.69%;margin-bottom:2.86%;}
.product ul li:nth-child(4n){margin-right:0;}
.product  ul li img{/* width:100%; */}
.product ul li h5{font-size:1.375rem;font-weight:700;margin:10px 0;
word-wrap: break-word;      /* IE 5.5-7 */
white-space: -moz-pre-wrap; /* Firefox 1.0-2.0 */
white-space: pre-wrap;      /* current browsers */;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp:2; /* 라인수 */
-webkit-box-orient: vertical;
word-wrap:break-word;  
}
.product ul li p{padding:10px 0;font-size:1.125rem;border-top:1px solid #ddd}



.review{width:100%;background:#f7f9fb;padding:7.81% 0}
.comment{text-align:left;}
.content{
font-size:1.125rem; font-weight:700; 
padding:0px 0;
margin-top:10px;
line-height:1.5;
width:100%; box-sizing:border-box;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp:2; /* 라인수 */
-webkit-box-orient: vertical;
word-wrap:break-word;  
margin-bottom:10px;
}
.title{color:#7d7d7d; width:100%;  display:inline-block; font-size:1.125rem; padding:15px 0 10px 0 ;margin:0 !important;border-top:1px solid #c0c0c0;}
.line2 {display:none}
.star{color:#ea3f24; font-size:1rem;margin:0 0 35px 0 !important;letter-spacing:2.5px;}
.date{color:#7d7d7d;float:right;letter-spacing:0.7px;}
.mySwiper2 .swiper-slide{background:#f7f9fb;}



section.insta{width:100%;padding:7.81% 0 10.42% 0}
.insta  img{width:100%;}



.m_bn { background-color:#f3f7f6 !important;width:100%; height:38vh;   display:inline-block;  display:flex;  align-items:center; justify-content:center; overflow:hidden; position:relative}
.m_bn  img.img {position:absolute; left:0; top:0;  height:100%}
section.m_bn div  {width:74.75%; text-align:center; margin:0 auto;  font-size:2.25rem; font-weight:500; z-index:999} 
section.m_bn div a img {width:50%; max-width:300px; margin-top:20px}



@media (max-width:1200px){
.visual h1 {font-size:3.8rem}
}
@media all and (min-width: 901px) and (max-width: 1200px) {
.star{font-size:.8rem;letter-spacing:0.5px;}
}

@media (max-width:900px){
#main{padding-top:40px}   
.swiper-horizontal>.swiper-pagination-bullets, .swiper-pagination-bullets.swiper-pagination-horizontal, .swiper-pagination-custom, .swiper-pagination-fraction {
bottom: 7% !important}
.visual{height:700px}
/* 
.visual1{background:url('/common/img/m_bg1.png') no-repeat 60% 0 !important; background-size:cover !important;}*/
.visual2{background-position: right } 
.visual div.text{}
.visual h1 {font-size:2.6rem}
.visual .vi_text {font-size:23px;}
.visual a {font-size:14px;width:100px;padding:0}

.swiper-button-next{display:none !important}
.swiper-button-prev{display:none !important}
.swiper-pagination2{display:block;  position: absolute;
text-align: center;
transition: 300ms opacity;
transform: translate3d(0, 0, 0);
z-index: 10;
bottom:0}
.vi2 br{display:none}



.subject{font-size:1.875rem}
.inner{width:94%}

.product{padding:18% 0 16% 0}
.product .more{padding:10px 7px;line-height:13px;margin:-2% 0 4% 0;padding:10px 7px; font-size:13px;line-height:13px}
.product img{vertical-align:-1.5px;}

.product ul li{width:48%;margin-right:4%;margin-bottom:4%}
.product ul li:nth-child(2n){margin-right:0;}
.product ul li:nth-child(4n){margin-right:0;}
.product ul:last-child li{margin-bottom:4%}
.product ul:last-child li:nth-child(3){margin-bottom:0}
.product ul:last-child li:nth-child(4){margin-bottom:0;}
.product ul li:nth-child(7){margin-bottom:0;}
.product ul li:nth-child(8){margin-bottom:0;}
.product ul li h5{font-size:20px;}
.product ul li p{font-size:18px}



.review {padding:16% 0}
.content{
display: -webkit-box;
-webkit-line-clamp:1; /* 라인수 */
-webkit-box-orient: vertical;
}
.title{
display: -webkit-box;
-webkit-line-clamp:1; /* 라인수 */
-webkit-box-orient: vertical;
overflow:hidden;border:0;padding:0
}
.line2 {width:100%; height:1px; display:inline-block; margin:1% 0; background-color:#c0c0c0}
.star{padding-top:15px;}



section.insta{padding:16% 0 18% 0}



/* .m_bn:after {background-color:rgba(255,255,255,.5); width:100%; height:100%; position:absolute; top:0; left:0; content:''} */
.m_bn { height:30vh;background: url('/common/img/banner_op.png') no-repeat center; background-size:cover;}
/* .m_bn  img.img {position:absolute; left:0; bottom:0; top:auto;  height:auto; width:80%; opacity:.6}
section.m_bn div  {width:100%; position:relative; font-size:4.5vw } */
.m_bn  img.img {position:absolute; left:0; bottom:0; top:auto;  height:auto; width:80%; opacity:.6;display:none}
section.m_bn div  {width:100%; position:relative; font-size:4.5vw;opacity:1 !important} 
}



@media (max-width:600px){
.visual{height:600px}
.visual div.text{padding-top:165px}
.visual h1 {font-size:2.2rem}
.visual .vi_text {font-size:1.4rem;}
.visual a {font-size:.9rem}
.visual2 { background-position:70% 0}
}



@media (max-width:450px){
.star{font-size:.7rem}
}