@import url(https://cdn.jsdelivr.net/gh/moonspam/NanumSquare@2.0/nanumsquare.css);
html,body{height: 100%;}
.turn a,.turn div,.turn span,.turn a,.turn p,.turn i{font-family: 'NanumSquare', sans-serif !important; letter-spacing: -2px;}
.turnwrap .turn img{display:block;}
.turnwrap,.turn{width: 100%;position: relative;max-width: 640px;margin: auto;overflow: hidden;}
.turnwrap .turn .inner{position: absolute;width: 100%; top:0;left: 0;height: 100%;}
.turnwrap .quicks{width: 100%;position: fixed;bottom: 3%; left: 50%; transform: translate(-50%,0);z-index: 10;display: none !important;}
.turnwrap .quicks.on{width: 100%;position: fixed;bottom: 3%; left: 50%; transform: translate(-50%,0);z-index: 10;display: block !important;}
.turnwrap .turn1 .inner .turnlogo{padding: 7% 0 23% 4%;}
.turnwrap .turn1 .inner .turnlogo a{display: inline-block;width: 19.206%;margin-right: 1%;}
.turnwrap .turn1 .inner h1{width: 100%;margin-bottom: 82%;}
.gals{position: relative;}
.gals .swiper{margin-left: auto; margin-right: auto;position: relative;overflow: hidden; overflow: clip; list-style: none;padding: 0; z-index: 1;display: block;}
.gals .swiper-wrapper {position: relative; width: 100%;height: 100%; z-index: 1;display: flex; transition-property: transform;transition-timing-function: var(--swiper-wrapper-transition-timing-function, initial); box-sizing: content-box; }
.gals .swiper-android .swiper-slide,.swiper-ios .swiper-slide,.swiper-wrapper {transform: translate3d(0px, 0, 0);}
.gals .swiper-slide {flex-shrink: 0;width: 100%;height: 100%; position: relative;transition-property: transform; display: block;}
.turnwrap .turn2 .gals p.T1{position: absolute;bottom: 3%; width: 100%; text-align: center;color:#fff;font-size: calc( 18px + 18 * ( 100vw - 640px ) / 640 );z-index: 10;letter-spacing: 0;opacity: 0.5;}
.turnwrap .turn4,.turnwrap .turn5{padding-top: 120%;}
.turnwrap .turn6{padding-top: 128%;}
.turnwrap .turn4 .imgs1,.turnwrap .turn5 .imgs1{padding: 23% 0 8% 0;opacity: 0;}
.turnwrap .turn6 .imgs1{padding: 23% 0 12% 0;opacity: 0;}
.turnwrap .turn4 .imgs1.on,.turnwrap .turn5 .imgs1.on,.turnwrap .turn6 .imgs1.on{animation:fade-in-top 1s ease both ;}
.turnwrap .turn4 p.T1,.turnwrap .turn5 p.T1{padding-bottom: 20%;}
.turnwrap .turn6 p.T1{padding-bottom: 22%;}
.turnwrap .turn4 ul,.turnwrap .turn5 ul{width: 88%; margin: auto;display: flex;align-items: center;justify-content: center;}
.turnwrap .turn4 ul li,.turnwrap .turn5 ul li{display: flex;width: 50%;margin:0 1.5%;opacity: 0;}
.turnwrap .turn4 ul li.on,.turnwrap .turn5 ul li.on,.turnwrap .turn6 .imgs2.on{animation:fade-in-top 1s ease both ;}
.turnwrap .turn4 ul li:nth-of-type(2).on,.turnwrap .turn5 ul li:nth-of-type(2).on{animation-delay: 0.3s;}
.turnwrap .turn6 .imgs2{width: 85%;margin: auto;opacity: 0;}
.turnwrap .turn7 .anitxt{position: relative;animation: wi2 8s linear infinite;width: 100%;margin-bottom: 15%;}
.turnwrap .turn7 .inner .Tbox{padding: 0 0 5% 12%;}
.turnwrap .turn7 .inner .Tbox p{color:#fff;font-size: calc( 32px + 32 * ( 100vw - 640px ) / 640 );position: relative;line-height: calc( 46px + 46 * ( 100vw - 640px ) / 640 );font-weight: 100;}
.turnwrap .turn7 .inner .Tbox p:before{content: '';width: calc( 22px + 22 * ( 100vw - 640px ) / 640 ); height: calc( 22px + 22 * ( 100vw - 640px ) / 640 ); border: calc( 5px + 5 * ( 100vw - 640px ) / 640 ) solid #fff;border-radius: calc( 22px + 22 * ( 100vw - 640px ) / 640 );left: calc( -40px + -40 * ( 100vw - 640px ) / 640 ); display: inline-block;position: absolute;top: calc( 8px + 8 * ( 100vw - 640px ) / 640 );}
.turnwrap .turn7 .inner .Tbox p span{color:#fff;font-size: calc( 24px + 24 * ( 100vw - 640px ) / 640 );letter-spacing: 0;font-weight: 100;}
.turnwrap .turn7 .inner .Tbox p i{color:#fff;font-weight: 700;}
.turnwrap .turn7 .inner .imgs1{margin-bottom: 7%;position: relative;z-index: 1}
.turnwrap .turn7 .inner .imgs2{margin-bottom: -7%;}
.turnwrap .turn7 .inner .imgs3{margin-bottom: -35%;position: relative;z-index: 2}
.turnwrap .turn7 .inner .imgs{opacity: 0;}
.turnwrap .turn7 .inner .imgs.on{animation: fade-in-top 1s linear both;}
.turnwrap .turn7 .inner .imgs2.on{animation-delay: 0.2s;}
.turnwrap .turn7 .inner .imgs3.on{animation-delay: 0.2s;}
.turnwrap .turn7 .inner .imgs4.on{animation-delay: 0.2s;}
.turnwrap .turn8 p.T1{padding: 20% 0 7% 0; }
.turnwrap .turn8 .gals .arowarea{position: absolute;top: 50%; z-index: 3;width: 100%;margin-top: -35px;}
.turnwrap .turn8 .gals .swiper-button-next,.turnwrap .turn8 .swiper-button-prev{background: url(https://ad.goodneighbors.kr/turn24b/mobile/images/arow.png) no-repeat;cursor: pointer;width: calc( 31px + 31 * ( 100vw - 640px ) / 640 ); height: calc( 69px + 69 * ( 100vw - 640px ) / 640 );position: absolute;}
.turnwrap .turn8 .gals .swiper-button-next{background-position-x:calc( -31px + -31 * ( 100vw - 640px ) / 640 );right: 4%;background-size: cover;}
.turnwrap .turn8 .gals .swiper-button-prev{left: 4%;background-size: cover;}
.turnwrap .turn9{padding: 16% 0 13% 0;}
.turnwrap .turn9 p.T1{margin-bottom: 10%;}
.turnwrap .turn10{padding: 17% 0;background: #f7f9f5;;}
.turnwrap .turn10 .turnbox{width: 86%;margin: auto;}
.turnwrap .turn11 .inner p.T1{padding: 11% 0 7% 0;color:#fff; text-align: center;font-size: calc( 30px + 30 * ( 100vw - 640px ) / 640 );line-height: calc( 44px + 44 * ( 100vw - 640px ) / 640 );font-weight: 100;}
.turnwrap .turn11 .inner p.T1 span{font-weight: 700;color:#fff}
.turnwrap .turn12{background: #efefef;padding: 14% 0;}
.turnwrap .turn12 .tabarea{width: 94%; margin: auto;margin-bottom: 10%;}
.turnwrap .turn12 .tabarea .tabs{width: 100%;margin-bottom: 4%;overflow: hidden;display: flex;align-items: center;justify-content: space-between;}
.turnwrap .turn12 .tabarea .tabs a{width: 32%;background: #fff;font-size: calc( 26px + 26 * ( 100vw - 640px ) / 640 );font-weight: 700;display: flex; justify-content: center;padding: 7% 0;}
.turnwrap .turn12 .tabarea .tabs a.on{background: #000;color:#d4ef34;}
.turnwrap .turn12 .tabarea .tab-content{display: none;}
.turnwrap .turn12 .tabarea .tab-content.on{display: block;}
.turnwrap .turn12 .tabarea .tab-content .acbtn{background: #fff;padding: 6%;color:#000;font-size: calc( 22px + 22 * ( 100vw - 640px ) / 640 );display: block;font-weight: 700;position: relative;border-bottom: 1px solid #c8c8c8;font-weight: 900;padding-left: 10%;letter-spacing: -1px;}
.turnwrap .turn12 .tabarea .tab-content .acbtn:after{content: '';position: absolute;background: url(https://ad.goodneighbors.kr/potential23/web/images/arow2.png) no-repeat;width: calc( 19px + 19 * ( 100vw - 640px ) / 640 ); height: calc( 17px + 17 * ( 100vw - 640px ) / 640 );right: calc( 46px + 46 * ( 100vw - 640px ) / 640 ); top: 50%; margin-top: -8.5px;background-size: cover;}
.turnwrap .turn12 .tabarea .tab-content .acbtn:before{content: 'Q';position: absolute;margin: 0.3% 0 0 -4%;}
.turnwrap .turn12 .tabarea .tab-content .acbtn.on:after{background: url(https://ad.goodneighbors.kr/potential23/web/images/arow3.png) no-repeat;background-size: cover;}
.turnwrap .turn12 .tabarea .tab-content p.T2{padding: 5%;color:#777;font-size: calc( 18px + 18 * ( 100vw - 640px ) / 640 );;display: none;background: #fff;line-height: calc( 32px + 32 * ( 100vw - 640px ) / 640 );text-align: justify;letter-spacing: -1px;}
.turnwrap .turn12 .tabarea .tab-content p.T2.botb{border: 0;}
.turnwrap .turn12 .tabarea .tab-content p.T2.on{display: block;}

.mYT {width:100%; max-width: 640px; margin: auto; position: relative; z-index: 12;display: none;}
.mYT .Ring_Size {position: fixed; top:0%; left:0%; width:100%; height: 100%; background:#fff; padding: 15% 5%; }
.mYT .Ring_Size .Ring_Size_X {position: absolute; top:2%; right: 4%; width:6%;}
.mYT .Ring_Size.show{opacity: 1; z-index: 100;}
.mYT .Ring_Size .Rs_T1 {font-size: 3.5vw; text-align: center; font-weight: 500;}
.mYT .Ring_Size .Rs_T1 span {color:#d4ed48;}
.mYT .Ring_Size h2 {font-size: 6vw; line-height: 9vw; text-align: center; padding: 5% 0px 10%;font-weight: 700;}
.mYT .Ring_Size .Size_Cho {width:100%; overflow: hidden;}
.mYT .Ring_Size .Size_Cho .Ring_Img {width:49.5%; float:left;}
.mYT .Ring_Size .Size_Cho .Ring_Chos {width:49.5%; float:right;}
.mYT .Ring_Size .Size_Cho .Ring_Chos button {width:100%; margin-bottom: 2.9%; display: block;}
.mYT .Ring_Size .Size_Cho .Ring_Chos button img.On {display: none;}
.mYT .Ring_Size .Size_Cho .Ring_Chos button:nth-child(3) {margin-bottom: 0%;}
.mYT .Ring_Size .Txt1 {width:100%; padding: 10% 0px;}
.mYT .Ring_Size .Txt1 p {font-size: 3.3vw; line-height: 5.3vw; text-align: justify; letter-spacing: -0.15vw;}
.mYT .Ring_Size .Txt1 .Rs_T2 {font-weight: 700; padding-bottom: 2%;}
.mYT .Ring_Size .Txt1 .Rs_T3 {font-weight: 500;}
.mYT .Ring_Size .Txt1 .Rs_T4 {font-weight: 300;}
.mYT .Ring_Size .Txt2 {width:100%; padding-bottom: 10%;}
.mYT .Ring_Size .Txt2 p {font-size: 3.3vw; line-height: 5.3vw; font-weight: 300; position: relative; padding-left: 3%; text-align: justify;  letter-spacing: -0.15vw;}
.mYT .Ring_Size .Txt2 .Rs_T5 {font-weight: 700; padding: 0px 0px 2% 0px;}
.mYT .Ring_Size .Txt2 p::before {position: absolute; top:0%; left:0%; font-size: 3.3vw; line-height: 5.3vw; font-weight: 300;}
.mYT .Ring_Size .Txt2 .Rs_T6::before {content: '1.';}
.mYT .Ring_Size .Txt2 .Rs_T7::before {content: '2.';}
.mYT .Ring_Size .Txt2 .Rs_T8::before {content: '3.';}
.mYT .Ring_Size .Txt2 .Rs_T9::before {content: '4.';}
.mYT .Ring_Size .Size_Choice_End {display:block; width:100%; font-size: 5vw; background:#d7ff20; font-weight: 700; text-align: center; padding: 7% 0%; border-radius: 7px;}

.turnfooter{padding: 5% 0;text-align: center;background: #fff;font-size: calc( 16px + 16 * ( 100vw - 640px ) / 640 );}
#container{max-width: none !important;}
@media (min-width: 640px) {
    .turnwrap .turn2 .gals p.T1{font-size: 18px;;}
    .turnwrap .turn7 .inner .Tbox p{font-size: 32px; line-height: 46px;}
    .turnwrap .turn7 .inner .Tbox p:before{width: 22px; height: 22px; border-radius: 22px;;top: 8px;left: -40px;}
    .turnwrap .turn7 .inner .Tbox p span{font-size: 24px;;}
    .turnwrap .turn8 .gals .swiper-button-next,.turnwrap .turn8 .swiper-button-prev{width: 31px; height: 69px;}
    .turnwrap .turn8 .gals .swiper-button-next{background-position: -31px 0;}
    .turnwrap .turn11 .inner p.T1{font-size: 30px; line-height: 44px;}
    .turnwrap .turn12 .tabarea .tabs a{font-size: 26px;;}
    .turnwrap .turn12 .tabarea .tab-content .acbtn{font-size: 22px;}
    .turnwrap .turn12 .tabarea .tab-content p.T2{font-size: 18px; line-height: 32px;}
    .turnwrap .turn12 .tabarea .tab-content .acbtn:after{width: 19px; height: 17px;right: 46px; top: 50%; margin-top: -8.5px;}
}
@keyframes wi1{0%{clip-path: polygon(0 0, 17.5% 0, 17.5% 100%, 0% 100%);margin-left: 35%}100%{clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);margin-left: 0%}}
@keyframes wi2{0%{left: 100%;}100%{left: -100%;}}
@-webkit-keyframes fade-in-top{0%{-webkit-transform:translateY(-20px);transform:translateY(-20px);opacity:0}100%{-webkit-transform:translateY(0);transform:translateY(0);opacity:1}}@keyframes fade-in-top{0%{-webkit-transform:translateY(-20px);transform:translateY(-20px);opacity:0}100%{-webkit-transform:translateY(0);transform:translateY(0);opacity:1}}

