#top_banner {position:relative;overflow:hidden; }
.category_01 #top_banner {background:#1fdfcb;}
.category_02 #top_banner {background:#ff698c;} /* 건강 */
.category_03 #top_banner {background:#fa6464;} /* 다이어트 */
.category_04 #top_banner {background:#a883d4;} /* 화장품 */
.category_05 #top_banner, /* 주식 */
.category_11 #top_banner {background:#5894de;} /* IT */
.category_06 #top_banner {background:#69b513;} /* 교육 */
.category_07 #top_banner {background:#fc9a30;} /* 장기렌트 */
.category_08 #top_banner, /* 병의원 */
.category_10 #top_banner {background:#66c8ec;} /* 부동산 */
.category_09 #top_banner, /* 번역 */
.category_12 #top_banner {background:#f9ca27;} /* 법률 */


#top_banner:not(.banner_test) .main_text{width:1055px; line-height:1.6; position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); z-index:3;padding:0 10px;box-sizing:border-box;}
#top_banner.banner_test .main_text {width:1055px; line-height:1.6; position:absolute; top:calc(50% + 20px); left:50%; transform: translate(-50%, -50%); z-index:10; padding:0 10px;box-sizing:border-box;}
/*
.category_01 #top_banner .main_text {background:rgba(31,223,203, 0.9);}
.category_02 #top_banner:not(.banner_test) .main_text {background:rgba(255,105,140, 0.9);}
.category_03 #top_banner .main_text {background:rgba(250,100,100, 0.9);}
.category_04 #top_banner .main_text {background:rgba(168,131,212, 0.9);}
.category_05 #top_banner .main_text {background:rgba(88,148,222, 0.9);}
.category_06 #top_banner .main_text {background:rgba(127,171,92, 0.9);}
.category_07 #top_banner .main_text {background:rgba(252,154,48, 0.9);}
.category_08 #top_banner .main_text {background:rgba(102,200,236, 0.9);}
.category_09 #top_banner .main_text {background:rgba(249,202,39, 0.9);}
*/

.line_banner {width:100%; overflow:hidden; background:linear-gradient(to left, #a283f7, #a283f7 50%, #8ab6ff 50%);}
.line_banner a {position:relative;}
.line_banner .pc_bn {}
.line_banner .mo_bn {display:none;}
.line_banner a > img {display:block; max-width:1920px; width:100%; position:relative; left:50%; transform:translateX(-50%);}
.line_banner .pc_bn img {height:135px;}


/*** 0915 edit : s ***/
/* gradient bg */
#top_banner.banner_test {width:100%; height:100vh; }
.category_02 #top_banner.banner_test {background:linear-gradient(180deg, #FF698C 15%, #d7ebff);} /* 건강 */
.category_03 #top_banner.banner_test {background:linear-gradient(180deg, #FA6464 15%, #CCFFCC);} /* 다이어트 */
.category_04 #top_banner.banner_test {background:linear-gradient(180deg, #A883D4 15%, #CCFFFF);} /* 화장품 */
.category_05 #top_banner.banner_test, /* 주식 */
.category_11 #top_banner.banner_test {background:linear-gradient(180deg, #5894DE 15%, #CCFFCC);} /* IT */
.category_06 #top_banner.banner_test {background:linear-gradient(180deg, #51B385 15%, #DFE8CC);} /* 교육 */
.category_07 #top_banner.banner_test {background:linear-gradient(180deg, #FC9A30 15%, #E6DCFF);} /* 렌트리스 */
.category_08 #top_banner.banner_test, /* 병의원 */
.category_10 #top_banner.banner_test {background:linear-gradient(180deg, #66C8EC 15%, #3385D7);} /* 부동산 */
.category_09 #top_banner.banner_test, /* 번역 */
.category_12 #top_banner.banner_test {background:linear-gradient(180deg, #F9CA27 15%, #FFD0E1);} /* 법률 */

.category_02 #top_banner.color_test {background:linear-gradient(180deg, #a883d4 15%, #d7ebff);}
.category_02 #top_banner.color_test2 {background:linear-gradient(180deg, #66c8ec 15%, #5894de);}

.ishere.cate_main header {border-bottom:0;}
.ishere.cate_main header::after {
	content:''; width:100%; height:1px; background:#fff; opacity:0.8;
	position:absolute; left:0; bottom:-1px;
} 
.ishere.cate_main header::before {
	content:''; position:absolute; top:0; left:0; width:100%; height:100%;
	animation: bgChange 20s linear infinite;
}
.ishere.category_02_test header::before, .ishere.cate_main header::before {
	animation: bgChange2 20s linear infinite; /* opacity랑 dropfilter때문에 맞춤 */
}
.category_02 #top_banner.banner_test .bg-layer, #top_banner.banner_test .bg-layer {
	animation: bgChange 20s linear infinite;
}

.category_02 #top_banner.banner_test .bg-layer, #top_banner.banner_test .bg-layer {width:100%; height:100%; position:absolute;}
.category_02 #top_banner.banner_test .main_text, #top_banner.banner_test .main_text {/*overflow:hidden;*/}
.category_02 #top_banner.banner_test .main_text .bg_before, #top_banner.banner_test .main_text .bg_before {	
	width:100%; 
	height:100%; 
	position:absolute; 
	opacity:0.85; 
	left:0; 
	top:0;
	overflow:hidden;
	-webkit-filter:blur(15px);
	filter:blur(15px);
}
/* main_text gradient bg */
#top_banner.banner_test .main_text .bg_before .bg_inner {width:100vw; height:100vh; position:absolute; left:0; top:0;}
.category_02 #top_banner.banner_test .main_text .bg_before .bg_inner {background:linear-gradient(180deg, #FF698C 15%, #d7ebff); } /* 건강 */
.category_03 #top_banner.banner_test .main_text .bg_before .bg_inner {background:linear-gradient(180deg, #FA6464 15%, #CCFFCC); } /* 다이어트 */
.category_04 #top_banner.banner_test .main_text .bg_before .bg_inner {background:linear-gradient(180deg, #A883D4 15%, #CCFFFF); } /* 화장품 */
.category_05 #top_banner.banner_test .main_text .bg_before .bg_inner, /* 주식 */
.category_11 #top_banner.banner_test .main_text .bg_before .bg_inner {background:linear-gradient(180deg, #5894DE 15%, #CCFFCC); } /* IT */
.category_06 #top_banner.banner_test .main_text .bg_before .bg_inner {background:linear-gradient(180deg, #51B385 15%, #DFE8CC); } /* 교육 */
.category_07 #top_banner.banner_test .main_text .bg_before .bg_inner {background:linear-gradient(180deg, #FC9A30 15%, #E6DCFF); } /* 렌트리스 */
.category_08 #top_banner.banner_test .main_text .bg_before .bg_inner,/* 병의원 */
.category_10 #top_banner.banner_test .main_text .bg_before .bg_inner {background:linear-gradient(180deg, #66C8EC 15%, #3385D7); } /* 부동산 */
.category_09 #top_banner.banner_test .main_text .bg_before .bg_inner, /* 번역 */
.category_12 #top_banner.banner_test .main_text .bg_before .bg_inner {background:linear-gradient(180deg, #F9CA27 15%, #FFD0E1); } /* 법률 */


.category_02 #top_banner.banner_test .main_text .bg_before .bg_filter,
#top_banner.banner_test .main_text .bg_before .bg_filter {
	width:100vw; height:100vh; position:absolute; top:0; left:0;
}
.category_02 #top_banner.banner_test .main_text .bg_before .bg_filter::before,
#top_banner.banner_test .main_text .bg_before .bg_filter::before {
	content:''; position:absolute; top:0; left:0; width:100%; height:100%;
	animation: bgChange 20s linear infinite;
}

@keyframes bgChange {
	0% {-webkit-backdrop-filter:hue-rotate(0deg); backdrop-filter:hue-rotate(0deg);}
	50% {-webkit-backdrop-filter:hue-rotate(-90deg); backdrop-filter:hue-rotate(-90deg);}
	100% {-webkit-backdrop-filter:hue-rotate(0deg); backdrop-filter:hue-rotate(0deg);}
}
@keyframes bgChange2 {
	0% {-webkit-backdrop-filter:hue-rotate(0deg); backdrop-filter:hue-rotate(0deg);}
	50% {-webkit-backdrop-filter:hue-rotate(-85deg); backdrop-filter:hue-rotate(-85deg);}
	100% {-webkit-backdrop-filter:hue-rotate(0deg); backdrop-filter:hue-rotate(0deg);}
}

.category_02 #top_banner.color_test .main_text .bg_before {background:linear-gradient(180deg, #a883d4 15%, #d7ebff);}
.category_02 #top_banner.color_test2 .main_text .bg_before {background:linear-gradient(180deg, #66c8ec 15%, #5894de);}
/*.test > div > .pointer*/
.test > div p::before {
	display:inline-block; 
	width:20%; 
	max-width:49px; 
	height:19px; 
	position:absolute; 
	bottom:-16px; 
	left:50%; 
	transform:translateX(-50%);  
	background:url('../../images/bubble_pointer3.svg')no-repeat center top / contain;
}
/*.test > div.right > .pointer*/
.test > div.right p::before {transform: rotateY(180deg) translateX(50%);}
/*.test .speech-bubble .pointer*/
.test .speech-bubble p::before {
	width:10%; 
	max-width:18px; 
	bottom:-18px; 
	background:url('../../images/bubble_pointer_center2.svg')no-repeat center top / contain;
}
#top_banner.banner_test .main_text > div:not(.bg_before) {
	text-shadow:3px 3px 4px rgba(0, 0, 0, 0.1); 
	animation:mainTxt 3s alternate ease-in-out infinite;
}
@keyframes mainTxt {
	0% {opacity:1;}
	10% {opacity:1;}
	100% {/*opacity:0.7;*/ opacity:0.8;}
}
/*.bg_test .bubble .pointer*/
.bg_test .bubble p::before {
	content:''; 
	width:20%;
	max-width:49px; 
	height:19px; 
	position:absolute; 
	left:50%; 
	bottom:-16px; 
	z-index:-1;
	margin-top:auto;
	transform:rotateY(180deg) translateX(50%); 
	background:url('../../images/bubble_pointer3.svg')no-repeat center top / contain;
}
/*.bg_test .bubble.right .pointer*/
.bg_test .bubble.right p::before {transform: rotateY(0deg) translateX(-50%);}
/*.bg_test .bubble.pointer_center .pointer*/
.bg_test .bubble.pointer_center p::before {width:10%; max-width:18px; bottom:-18px; background:url('../../images/bubble_pointer_center2.svg')no-repeat center top / contain;}
/*** 0915 test : e ***/


#top_banner .main_text > div{font-size:124px;font-family:'GongGothicBold'; font-weight:normal; color:#fff;text-align:center;letter-spacing:-1px; position:relative;}
#top_banner .main_text div.l_2{border:7px solid #fff;position:relative;height:204px;}
#top_banner .main_text .typing-txt{display:none;}
#top_banner .main_text .typing-txt ul{list-style:none;}
#top_banner .main_text .typing {  
  margin:0 auto;text-align:center;
 /*  animation-name: cursor; 
  animation-duration: 0.3s; 
  animation-iteration-count: infinite; */ 
} 
/* @keyframes cursor{ 
  0%{border-right: 1px solid #fff} 
  50%{border-right: 1px solid #000} 
  100%{border-right: 1px solid #fff} 
} */

.bg {
	width:100%;
	position:absolute;
	top:0;
	left:0;
	animation:slidein 60s infinite linear;
	z-index:0; 
	line-height:1.3;
}
@keyframes slidein {
	0%{top:0;} 
	100%{top:-600%;} 
}

.bg_test {
	width:100%; 
	text-align:center; 
	animation:slidein2 70s infinite linear !important; 
	display:flex; 
	flex-direction:column; 
	line-height:1.3;
}
@keyframes slidein2 {
	0% {
		-webkit-transform: translate3d(0, 0, 0);
		transform: translate3d(0, 0, 0);
	}
	100% {
		-webkit-transform: translate3d(0, -100%, 0);
		transform: translate3d(0, -100%, 0);
	}
}
.bg_test .bubble {
	position:relative; 
	display: inline-block;
	text-align:left;
}
.bg_test .bubble p {
	display:inline-block;
    position:relative;
	-webkit-filter:drop-shadow(3px 3px 3px rgba(0, 0, 0, 5%));
	filter:drop-shadow(3px 3px 3px rgba(0, 0, 0, 5%));
}
.bg_test .bubble p span {
	display:inline-block;
    padding:14px 26px;
    background:#fff;
    font-size:22px;
    color:#3c3c3c;
    position:relative;
    z-index:3;
    text-align:center;
    max-width:400px;
	font-family: 'GongGothicLight';
	-webkit-border-top-left-radius:400px 350px;
	-webkit-border-top-right-radius:400px 350px;
	-webkit-border-bottom-right-radius:400px 350px;
	-webkit-border-bottom-left-radius:400px 350px;
	-moz-border-radius:400px / 350px;
	border-radius:400px / 350px;
	box-shadow:inset -3px -3px 8px rgba(0, 0, 0, 0.25);
	-webkit-filter:drop-shadow(3px 3px 5px rgba(0, 0, 0, 15%));
	filter:drop-shadow(3px 3px 5px rgba(0, 0, 0, 15%));
}

.oval-quotes {
  position:absolute;
  max-width:400px;
  color:#3c3c3c;
  background:#fff;
  font-family: 'GongGothicLight';
  /* css3 */
  /*
  NOTES:
  -webkit-border-radius:Apx Bpx; // produces oval in safari 4 and chrome 4
  -webkit-border-radius:Apx / Bpx; // produces oval in chrome 4 (again!) but not supported in safari 4
  Not correct application of the current spec, therefore, using longhand to avoid future problems with webkit corrects this
  */
  -webkit-border-top-left-radius:400px 350px;
  -webkit-border-top-right-radius:400px 350px;
  -webkit-border-bottom-right-radius:400px 350px;
  -webkit-border-bottom-left-radius:400px 350px;
  -moz-border-radius:400px / 350px;
  border-radius:400px / 350px;
}

/* creates opening quotation mark */
.oval-quotes:before,
.bubble span:before {
  content:"\201C";
  position:absolute;
  z-index:1;
  top:-20px;
  left:-20px;
  font:80px/1 Georgia, serif;
  color:#fff;
}

/* creates closing quotation mark */
.oval-quotes:after,
.bubble span:after {
  content:"\201D";
  position:absolute;
  z-index:1;
  bottom:-20px;
  right:-30px;
  font:80px/0.25 Georgia, serif;
  color:#fff;
}
.bubble.n-ico span:before,
.bubble.n-ico span:after {display:none;}

.oval-quotes p {
  padding:14px 26px;
  margin:0 auto;
  text-align:center;
  font-size:22px;	
  font-weight:400;
}

/* creates smaller curve */
.oval-quotes p:before {
  content:"";
  position:absolute;
  z-index:-1;
  bottom:-30px;
  right:51%; /* 말풍선 꼬리 위치 이동 */
  width:180px; /* wider than necessary to make it look a bit better in IE8 */
  height:60px;
  /* need this for webkit - bug in handling of border-radius */
  color:#fff;
  /* css3 */
  -webkit-border-bottom-right-radius:40px 50px;
  -moz-border-radius-bottomright:40px 50px;
  border-bottom-right-radius:40px 50px;
  /* using translate to avoid undesired appearance in CSS2.1-capabable but CSS3-incapable browsers */
  -webkit-transform:translate(-30px, -2px);
  -moz-transform:translate(-30px, -2px);
  -ms-transform:translate(-30px, -2px);
  -o-transform:translate(-30px, -2px);
  transform:translate(-30px, -2px);
}

.category_02 .oval-quotes p:before {  background:#ff698c;}
.category_03 .oval-quotes p:before {  background:#fa6464;}
.category_04 .oval-quotes p:before {  background:#a883d4;}
.category_05 .oval-quotes p:before,
.category_11 .oval-quotes p:before {  background:#5894de;}
.category_06 .oval-quotes p:before {  background:#7fab5c;}
.category_07 .oval-quotes p:before {  background:#fc9a30;}
.category_08 .oval-quotes p:before,
.category_10 .oval-quotes p:before {  background:#66c8ec;}
.category_09 .oval-quotes p:before,
.category_12 .oval-quotes p:before {  background:#f9ca27;}



/* creates larger curve */
.oval-quotes p:after {
  content:"";
  position:absolute;
  z-index:-2;
  bottom:-22px;
  right:39%; /* 말풍선 꼬리 크기 수정 */
  height:51px;
  border-right:200px solid #fff;
  color:#fff;
  /* background:#fff; */ /* need this for webkit - bug in handling of border-radius */

  background:blue; /* need this for webkit - bug in handling of border-radius */
  /* css3 */
  -webkit-border-bottom-right-radius:200px 100px;
  -moz-border-radius-bottomright:200px 100px;
  border-bottom-right-radius:200px 100px;
  /* using translate to avoid undesired appearance in CSS2.1-capabable but CSS3-incapable browsers */
  -webkit-transform:translate(0, -2px);
  -moz-transform:translate(0, -2px);
  -ms-transform:translate(0, -2px);
  -o-transform:translate(0, -2px);
  transform:translate(0, -2px);
  /* reduce the damage in FF3.0 */
  display:block;
  width:0;
}


/* creates smaller curve */
.oval-quotes.right p:before {
  content:"";
  position:absolute;
  z-index:-1;
  bottom:-30px;
  left:69%; /* 말풍선 꼬리 크기 수정 */
  right:auto;
  width:180px; /* wider than necessary to make it look a bit better in IE8 */
  height:60px;
  /* need this for webkit - bug in handling of border-radius */
  color:#fff;
  /* css3 */
  -webkit-border-bottom-left-radius:40px 50px;
  -moz-border-radius-bottomleft:40px 50px;
  border-bottom-left-radius:40px 50px;
  /* using translate to avoid undesired appearance in CSS2.1-capabable but CSS3-incapable browsers */
  -webkit-transform:translate(-30px, -2px);
  -moz-transform:translate(-30px, -2px);
  -ms-transform:translate(-30px, -2px);
  -o-transform:translate(-30px, -2px);
  transform:translate(-30px, -2px);
}


.category_01 .oval-quotes.right p:before  {  background:#1fdfcb;}
.category_02 .oval-quotes.right p:before  {  background:#ff698c;}
.category_03 .oval-quotes.right p:before  {  background:#fa6464;}
.category_04 .oval-quotes.right p:before  {  background:#a883d4;}
.category_05 .oval-quotes.right p:before,
.category_11 .oval-quotes.right p:before  {  background:#5894de;}
.category_06 .oval-quotes.right p:before  {  background:#7fab5c;}
.category_07 .oval-quotes.right p:before  {  background:#fc9a30;}
.category_08 .oval-quotes.right p:before,
.category_10 .oval-quotes.right p:before  {  background:#66c8ec;}
.category_09 .oval-quotes.right p:before,
.category_12 .oval-quotes.right p:before  {  background:#f9ca27;}



/* creates larger curve */
.oval-quotes.right p:after {
  content:"";
  position:absolute;
  z-index:-2;
  bottom:-22px;
  left:33%; /* 말풍선 꼬리 크기 수정 */
  right:auto;
  height:51px;
  border-right:200px solid #fff;
  color:#fff;
  background:#fff; /* need this for webkit - bug in handling of border-radius */
  /* css3 */
  -webkit-border-bottom-left-radius:200px 100px;
  -moz-border-radius-bottomleft:200px 100px;
  border-bottom-left-radius:200px 100px;
  /* using translate to avoid undesired appearance in CSS2.1-capabable but CSS3-incapable browsers */
  -webkit-transform:translate(0, -2px);
  -moz-transform:translate(0, -2px);
  -ms-transform:translate(0, -2px);
  -o-transform:translate(0, -2px);
  transform:translate(0, -2px);
  /* reduce the damage in FF3.0 */
  display:block;
  width:0;
}

.oval-quotes + p {
  position:relative; /* part of the IE8 width compromise */
  width:150px;
  margin:0 0 2em;
  font-size:18px;
  font-weight:bold;
}

.oval-quotes.n-ico:after,.oval-quotes.n-ico:before{display:none;}

.speech-bubble {
	position: absolute;
    background: #ffffff;
    border-radius: .4em;
    padding: 17px 34px;
    border-radius: 60px;
    font-size: 28px;
    font-weight: 400;
	text-align:center;
	font-family: 'GongGothicLight';
}
.speech-bubble p {line-height:1;}
.speech-bubble:after {
	content: '';
	position: absolute;
	bottom: 2px;
	left: 50%;
	width: 0;
	height: 0;
	border: 20px solid transparent;
	border-top-color: #ffffff;
	border-bottom: 0;
	margin-left: -20px;
	margin-bottom: -20px;
}
.bubble.pointer_center p span {
	border-radius: 60px;
    font-size: 28px;
    font-weight: 400;
	padding:17px 34px;
	text-align:center;
	font-family: 'GongGothicLight';
	line-height:1;
}


.oval-quotes.quo1{left:10%;top:5%;}
.speech-bubble.quo2{left:50%;top:16%;}
.oval-quotes.quo3{left:-3%;top:35%;}
.oval-quotes.quo3 p{font-size:32px;}
.oval-quotes.quo4{left:30%;top:40%;}
.oval-quotes.quo4 p{font-size:18px;}
.oval-quotes.quo5{right:5%;top:30%;}
.speech-bubble.quo6{right:-2%;top:100%;}
.oval-quotes.quo7{left:1%;top:80%;}
.oval-quotes.quo8{left:40%;top:108%;}
.oval-quotes.quo9{right:2%;top:140%;}
.oval-quotes.quo10{left:7%;top:125%;}
.speech-bubble.quo11{left:50%;top:170%;}
.oval-quotes.quo12{left:-3%;top:155%;}
.oval-quotes.quo12 p{font-size:26px;}
.oval-quotes.quo13{left:16%;top:186%;}
.oval-quotes.quo13 p{font-size:18px;}
.oval-quotes.quo14{right:2%;top:198%;}
.speech-bubble.quo15{right:-2%;top:264%;}
.oval-quotes.quo16{left:1%;top:210%;}
.oval-quotes.quo17{left:40%;top:240%;}

.oval-quotes.quo18{right:-2%;top:224%;}
.oval-quotes.quo19{left:8%;top:278%;}
.speech-bubble.quo20{left:50%;top:294%;}
.oval-quotes.quo21{left:-3%;top:314%;}
.oval-quotes.quo21 p{font-size:32px;}
.oval-quotes.quo22{left:30%;top:328%;}
.oval-quotes.quo22 p{font-size:18px;}
.oval-quotes.quo23{right:5%;top:328%;}
.speech-bubble.quo24{right:-2%;top:388%;}
.oval-quotes.quo25{left:1%;top:350%;}
.oval-quotes.quo26{left:26%;top:382%;}
.oval-quotes.quo27{right:2%;top:356%;}
.oval-quotes.quo28{left:10%;top:405%;}
.speech-bubble.quo29{left:50%;top:416%;}
.oval-quotes.quo30{left:-3%;top:435%;}
.oval-quotes.quo30 p{font-size:32px;}
.oval-quotes.quo31{left:24%;top:470%;}
.oval-quotes.quo31 p{font-size:18px;}
.oval-quotes.quo32{right:5%;top:446%;}
.speech-bubble.quo33{right:-2%;top:532%;}
.oval-quotes.quo34{left:1%;top:490%;}

.oval-quotes.quo35{left:40%;top:508%;}
.oval-quotes.quo36{right:2%;top:496%;}
.oval-quotes.quo37{left:10%;top:515%;}
.speech-bubble.quo38{left:50%;top:592%;}
.oval-quotes.quo39{left:-3%;top:545%;}
.oval-quotes.quo39 p{font-size:32px;}
.oval-quotes.quo40{left:18%;top:576%;}
.oval-quotes.quo40 p{font-size:18px;}
.oval-quotes.quo41{right:5%;top:570%;}
.speech-bubble.quo42{right:-2%;top:650%;}
.oval-quotes.quo43{left:1%;top:600%;}
.oval-quotes.quo44{left:40%;top:628%;}
.oval-quotes.quo45{right:2%;top:624%;}
.oval-quotes.quo46{left:10%;top:660%;}
.speech-bubble.quo47{left:50%;top:680%;}
.oval-quotes.quo48{left:-3%;top:704%;}
.oval-quotes.quo48 p{font-size:32px;}
.oval-quotes.quo49{left:16%;top:734%;}
.oval-quotes.quo49 p{font-size:18px;}
.oval-quotes.quo50{right:5%;top:712%;}
.speech-bubble.quo51{right:-2%;top:740%;}
.oval-quotes.quo52{left:1%;top:760%;}
.oval-quotes.quo53{left:40%;top:780%;}
.oval-quotes.quo54{right:2%;top:790%;}
.oval-quotes.quo55{left:10%;top:804%;}

/* .bg_test bubble : s */
	
	/* left */
	.bg_test .bubble:nth-child(1) {margin-left:10%; margin-top:5vh;}
	.bg_test .bubble:nth-child(2) {margin-left:50%; margin-top:5vh;}
	.bg_test .bubble:nth-child(4) {margin-left:-3%;}
	.bg_test .bubble:nth-child(5) {margin-left:30%; }
	.bg_test .bubble:nth-child(6) {margin-left:1%; margin-top:31vh;}
	.bg_test .bubble:nth-child(8) {margin-left:40%; margin-top:2vh;}
	.bg_test .bubble:nth-child(9) {margin-left:7%; margin-top:11vh;}
	.bg_test .bubble:nth-child(11) {margin-left:-3%; margin-top:9vh;}
	.bg_test .bubble:nth-child(12) {margin-left:50%; margin-top:8vh;}
	.bg_test .bubble:nth-child(13) {margin-left:16%; margin-top:9vh;}
	/*여기서부터 위치 다시*/
	.bg_test .bubble:nth-child(15) {margin-left:1%; margin-top:6vh;}
	.bg_test .bubble:nth-child(17) {margin-left:40%; margin-top:10vh;}
	.bg_test .bubble:nth-child(19) {margin-left:8%; margin-top:7vh;}
	.bg_test .bubble:nth-child(20) {margin-left:50%; margin-top:10vh;}
	.bg_test .bubble:nth-child(21) {margin-left:-3%; margin-top:14vh;}
	.bg_test .bubble:nth-child(22) {margin-left:30%; margin-top:6vh;}
	.bg_test .bubble:nth-child(24) {margin-left:1%; margin-top:16vh;}
	.bg_test .bubble:nth-child(26) {margin-left:26%; margin-top:19vh;}
	.bg_test .bubble:nth-child(28) {margin-left:10%; margin-top:10vh;}
	.bg_test .bubble:nth-child(29) {margin-left:50%; margin-top:6vh;}
	.bg_test .bubble:nth-child(30) {margin-left:-3%; margin-top:12vh;}
	.bg_test .bubble:nth-child(32) {margin-left:24%; margin-top:18vh;}
	.bg_test .bubble:nth-child(33) {margin-left:1%; margin-top:14vh;}
	.bg_test .bubble:nth-child(35) {margin-left:40%; margin-top:6vh;}
	.bg_test .bubble:nth-child(36) {margin-left:10%; margin-top:1vh;}
	.bg_test .bubble:nth-child(38) {margin-left:-3%; margin-top:6vh;}
	.bg_test .bubble:nth-child(40) {margin-left:18%;}
	.bg_test .bubble:nth-child(41) {margin-left:50%; margin-top:10vh;}
	.bg_test .bubble:nth-child(42) {margin-left:1%; margin-top:2vh;}
	.bg_test .bubble:nth-child(44) {margin-left:40%; margin-top:-2vh;}
	.bg_test .bubble:nth-child(46) {margin-left:10%; margin-top:3vh;}
	.bg_test .bubble:nth-child(47) {margin-left:50%; margin-top:14vh;}
	.bg_test .bubble:nth-child(48) {margin-left:-3%; margin-top:17vh;}
	.bg_test .bubble:nth-child(50) {margin-left:16%; margin-top:17vh;}
	.bg_test .bubble:nth-child(52) {margin-left:1%;}
	.bg_test .bubble:nth-child(53) {margin-left:40%;}
	.bg_test .bubble:nth-child(55) {margin-left:10%;}

	/* right */
	.bg_test .bubble:nth-child(3) {margin-right:5%; margin-top:7vh; text-align:right;}
	.bg_test .bubble:nth-child(7) {margin-right:-2%; margin-top:14vh; text-align:right;}
	.bg_test .bubble:nth-child(10) {margin-right:2%; margin-top:9vh; text-align:right;}
	.bg_test .bubble:nth-child(14) {margin-right:2%; margin-top:7vh; text-align:right;}
	.bg_test .bubble:nth-child(16) {margin-right:-2%; margin-top:8vh; text-align:right;}
	.bg_test .bubble:nth-child(18) {margin-right:-2%; margin-top:18vh; text-align:right;}
	.bg_test .bubble:nth-child(23) {margin-right:5%; margin-top:-5vh; text-align:right;}
	.bg_test .bubble:nth-child(25) {margin-right:2%; text-align:right;}
	.bg_test .bubble:nth-child(27) {margin-right:-2%; text-align:right;}
	.bg_test .bubble:nth-child(31) {margin-right:5%; margin-top:4vh; text-align:right;}
	.bg_test .bubble:nth-child(34) {margin-right:2%; text-align:right;}
	.bg_test .bubble:nth-child(37) {margin-right:-2%; margin-top:11vh; text-align:right;}
	.bg_test .bubble:nth-child(39) {margin-right:5%; margin-top:18vh; text-align:right;}
	.bg_test .bubble:nth-child(43) {margin-right:2%; margin-top:18vh; text-align:right;}
	.bg_test .bubble:nth-child(45) {margin-right:-2%; margin-top:16vh; text-align:right;}
	.bg_test .bubble:nth-child(49) {margin-right:5%; text-align:right;}
	.bg_test .bubble:nth-child(51) {margin-right:-2%; text-align:right;}
	.bg_test .bubble:nth-child(54) {margin-right:2%; text-align:right;}

	/* font-size */
	.bg_test .bubble:nth-child(4) p,
	.bg_test .bubble:nth-child(21) p,
	.bg_test .bubble:nth-child(30) p,
	.bg_test .bubble:nth-child(38) p,
	.bg_test .bubble:nth-child(48) p {font-size:32px !important;}
	.bg_test .bubble:nth-child(11) p {font-size:26px !important;}
	.bg_test .bubble:nth-child(5) p,
	.bg_test .bubble:nth-child(13) p,
	.bg_test .bubble:nth-child(22) p,
	.bg_test .bubble:nth-child(32) p,
	.bg_test .bubble:nth-child(40) p,
	.bg_test .bubble:nth-child(50) p {font-size:18px !important;}

/* .bg_test bubble : e */

@media all and (max-width:1920px){
	.line_banner .pc_bn img {min-width:1920px;}
}

@media (max-width:1400px){
	#top_banner .main_text div.l_2{height:173px;}
	#top_banner .main_text{width:906px !important;}
	#top_banner .main_text > div{font-size:116px;}
	#top_banner.banner_test .main_text .l_1, #top_banner.banner_test .main_text .l_3 {line-height:1.15;}
	#top_banner.banner_test .main_text .l_2 {line-height:1.4;}

	.oval-quotes p,.speech-bubble{font-size:25px;}
	.bg .oval-quotes.quo3 p,.bg .oval-quotes.quo4 p,.bg .oval-quotes.quo12 p,.bg .oval-quotes.quo13 p,.bg .oval-quotes.quo21 p,.bg .oval-quotes.quo22 p,.bg .oval-quotes.quo30 p,.bg .oval-quotes.quo31 p,.bg .oval-quotes.quo39 p,.bg .oval-quotes.quo40 p,.bg .oval-quotes.quo48 p,.bg .oval-quotes.quo49 p{font-size:32px;}

	.bg_test .bubble.fontBig p {font-size:32px !important;}
}

@media all and (max-width:1200px){
	.line_banner .pc_bn img {width:163vw; min-width:initial; height:initial;}
}

@media (max-width:980px){
	#top_banner .main_text div.l_2{height:120px;}
	#top_banner .main_text{width:624px !important;}
	#top_banner .main_text > div{font-size:80px;}
	.oval-quotes p,.speech-bubble{font-size:22px;}
	.bg .oval-quotes.quo3 p,.bg .oval-quotes.quo4 p,.bg .oval-quotes.quo12 p,.bg .oval-quotes.quo13 p,.bg .oval-quotes.quo21 p,.bg .oval-quotes.quo22 p,.bg .oval-quotes.quo30 p,.bg .oval-quotes.quo31 p,.bg .oval-quotes.quo39 p,.bg .oval-quotes.quo40 p,.bg .oval-quotes.quo48 p,.bg .oval-quotes.quo49 p{font-size:28px;}

	.bg_test .bubble.fontBig p {font-size:28px !important;}

	.oval-quotes.right p:after{left:28%;}
}


@media (max-width:768px){
	.line_banner .pc_bn {display:none;}
	.line_banner .mo_bn {display:block;}
	
	#top_banner .main_text div.l_2{height:74px;}
	#top_banner .main_text{width:370px !important;}
	#top_banner .main_text > div{font-size:43px; text-shadow:2px 2px 5px rgba(0, 0, 0, 0.15);}
	.oval-quotes p,.speech-bubble{font-size:15px;}
	.oval-quotes p{padding:6px 15px;}
	.bg .oval-quotes.quo3 p,.bg .oval-quotes.quo4 p,.bg .oval-quotes.quo12 p,.bg .oval-quotes.quo13 p,.bg .oval-quotes.quo21 p,.bg .oval-quotes.quo22 p,.bg .oval-quotes.quo30 p,.bg .oval-quotes.quo31 p,.bg .oval-quotes.quo39 p,.bg .oval-quotes.quo40 p,.bg .oval-quotes.quo48 p,.bg .oval-quotes.quo49 p{font-size:18px;}

	.bg_test .bubble p span {padding:6px 15px; font-size:15px;}
	.bg_test .bubble.fontBig p span {font-size:18px !important;}
	.bg_test .bubble.pointer_center p span {font-size:15px !important; padding:10px 18px;}

	.speech-bubble{padding:10px 18px;}
	.oval-quotes:before,.oval-quotes:after, .bubble span:before, .bubble span:after {font-size:38px;}
	.oval-quotes:before, .bubble span:before{top:-10px;left:-10px;}
	.oval-quotes:after, .bubble span:after{bottom:-12px;right:-12px;}

	/* 말풍선 꼬리 크기 수정 */
	.oval-quotes p:after {right:40%;}
	.oval-quotes.right p:before {left:90%;}
	.oval-quotes.right p:after {left:50%;}
	.speech-bubble:after {margin-bottom: -15px;}


	/* 말풍선 안겹치게 수정 */
	.bg .oval-quotes.quo1{left:10%;top:5%;}
	.bg .speech-bubble.quo2{left:50%;top:16%;}
	.bg .oval-quotes.quo3{left:-3%;top:54%;}
	.bg .oval-quotes.quo4{left:30%;top:70%;}
	.bg .oval-quotes.quo5{right:15%;top:40%;}
	.bg .speech-bubble.quo6{right:-2%;top:100%;}
	.bg .oval-quotes.quo7{left:1%;top:80%;}
	.bg .oval-quotes.quo8{left:40%;top:113%;}
	.bg .oval-quotes.quo9{right:2%;top:140%;}
	.bg .oval-quotes.quo10{left:7%;top:125%;}
	.bg .speech-bubble.quo11{left:50%;top:170%;}
	.bg .oval-quotes.quo12{left:-3%;top:155%;}
	.bg .oval-quotes.quo13{left:16%;top:186%;}
	.bg .oval-quotes.quo14{right:2%;top:198%;}
	.bg .speech-bubble.quo15{right:-2%;top:264%;}
	.bg .oval-quotes.quo16{left:1%;top:210%;}
	.bg .oval-quotes.quo17{left:40%;top:240%;}

	.bg .oval-quotes.quo18{right:-2%;top:224%;}
	.bg .oval-quotes.quo19{left:8%;top:278%;}
	.bg .speech-bubble.quo20{left:50%;top:294%;}
	.bg .oval-quotes.quo21{left:-3%;top:314%;}
	.bg .oval-quotes.quo22{left:30%;top:328%;}
	.bg .oval-quotes.quo23{right:5%;top:340%;}
	.bg .speech-bubble.quo24{right:-2%;top:388%;}
	.bg .oval-quotes.quo25{left:1%;top:350%;}
	.bg .oval-quotes.quo26{left:26%;top:382%;}
	.bg .oval-quotes.quo27{right:2%;top:356%;}
	.bg .oval-quotes.quo28{left:10%;top:405%;}
	.bg .speech-bubble.quo29{left:50%;top:416%;}
	.bg .oval-quotes.quo30{left:-3%;top:427%;}
	.bg .oval-quotes.quo31{left:24%;top:470%;}
	.bg .oval-quotes.quo32{right:5%;top:446%;}
	.bg .speech-bubble.quo33{right:-2%;top:532%;}
	.bg .oval-quotes.quo34{left:1%;top:490%;}

	.bg .oval-quotes.quo35{left:40%;top:508%;}
	.bg .oval-quotes.quo36{right:2%;top:496%;}
	.bg .oval-quotes.quo37{left:4%;top:522%;}
	.bg .speech-bubble.quo38{left:50%;top:592%;}
	.bg .oval-quotes.quo39{left:-3%;top:580%;}
	.bg .oval-quotes.quo40{left:18%;top:552%;}
	.bg .oval-quotes.quo41{right:5%;top:570%;}
	.bg .speech-bubble.quo42{right:-2%;top:650%;}
	.bg .oval-quotes.quo43{left:1%;top:600%;}
	.bg .oval-quotes.quo44{left:40%;top:638%;}
	.bg .oval-quotes.quo45{right:2%;top:624%;}
	.bg .oval-quotes.quo46{left:10%;top:660%;}
	.bg .speech-bubble.quo47{left:50%;top:680%;}
	.bg .oval-quotes.quo48{left:-3%;top:704%;}
	.bg .oval-quotes.quo49{left:16%;top:734%;}
	.bg .oval-quotes.quo50{right:5%;top:720%;}
	.bg .speech-bubble.quo51{right:-2%;top:748%;}
	.bg .oval-quotes.quo52{left:1%;top:760%;}
	.bg .oval-quotes.quo53{left:40%;top:780%;}
	.bg .oval-quotes.quo54{right:2%;top:790%;}
	.bg .oval-quotes.quo55{left:10%;top:804%;}

	/* test bubble media query css : s */
	.bg_test .bubble:nth-child(1) {margin-top:px;}
	.bg_test .bubble:nth-child(2) {margin-top:45px;}
	.bg_test .bubble:nth-child(3) {margin-top:130px;}
	.bg_test .bubble:nth-child(4) {margin-top:70px;}
	.bg_test .bubble:nth-child(5) {margin-top:75px;}
	.bg_test .bubble:nth-child(6) {margin-top:35px;}
	.bg_test .bubble:nth-child(7) {margin-top:110px;}
	.bg_test .bubble:nth-child(8) {margin-top:55px;}
	.bg_test .bubble:nth-child(9) {margin-top:50px;}
	.bg_test .bubble:nth-child(10) {margin-top:75px;}
	.bg_test .bubble:nth-child(11) {margin-top:70px;}
	.bg_test .bubble:nth-child(12) {margin-top:70px;}
	.bg_test .bubble:nth-child(13) {margin-top:80px;}
	.bg_test .bubble:nth-child(14) {margin-top:50px;}
	.bg_test .bubble:nth-child(15) {margin-top:50px;}
	.bg_test .bubble:nth-child(16) {margin-top:70px;}
	.bg_test .bubble:nth-child(17) {margin-top:75px;}
	.bg_test .bubble:nth-child(18) {margin-top:135px;}
	.bg_test .bubble:nth-child(19) {margin-top:70px;}
	.bg_test .bubble:nth-child(20) {margin-top:70px;}
	.bg_test .bubble:nth-child(21) {margin-top:110px;}
	.bg_test .bubble:nth-child(22) {margin-top:60px;}
	.bg_test .bubble:nth-child(23) {margin-top:50px;}
	.bg_test .bubble:nth-child(24) {margin-top:40px;}
	.bg_test .bubble:nth-child(25) {margin-top:10px;}
	.bg_test .bubble:nth-child(26) {margin-top:150px;}
	.bg_test .bubble:nth-child(27) {margin-top:10px;}
	.bg_test .bubble:nth-child(28) {margin-top:50px;}
	.bg_test .bubble:nth-child(29) {margin-top:50px;}
	.bg_test .bubble:nth-child(30) {margin-top:40px;}
	.bg_test .bubble:nth-child(31) {margin-top:95px;}
	.bg_test .bubble:nth-child(32) {margin-top:140px;}
	.bg_test .bubble:nth-child(33) {margin-top:100px;}
	.bg_test .bubble:nth-child(34) {margin-top:10px;}
	.bg_test .bubble:nth-child(35) {margin-top:55px;}
	.bg_test .bubble:nth-child(36) {margin-top:65px; margin-left:30px;}
	.bg_test .bubble:nth-child(37) {margin-top:40px;}
	.bg_test .bubble:nth-child(38) {margin-top:100px; margin-left:100px;}
	.bg_test .bubble:nth-child(39) {margin-top:95px;}
	.bg_test .bubble:nth-child(40) {margin-top:35px; margin-left:-40px;}
	.bg_test .bubble:nth-child(41) {margin-top:50px;}
	.bg_test .bubble:nth-child(42) {margin-top:20px;}
	.bg_test .bubble:nth-child(43) {margin-top:140px;}
	.bg_test .bubble:nth-child(44) {margin-top:65px;}
	.bg_test .bubble:nth-child(45) {margin-top:50px;}
	.bg_test .bubble:nth-child(46) {margin-top:40px;}
	.bg_test .bubble:nth-child(47) {margin-top:100px;}
	.bg_test .bubble:nth-child(48) {margin-top:135px;}
	.bg_test .bubble:nth-child(49) {margin-top:75px;}
	.bg_test .bubble:nth-child(50) {margin-top:65px;}
	.bg_test .bubble:nth-child(51) {margin-top:70px;}

	@keyframes slidein {
	  0%{top:0;} 
	  100%{top:-660%;} 
	}
}

@media (max-width:376px){
	#top_banner .main_text{width:330px !important;}
	#top_banner .main_text > div{font-size:40px;}
	#top_banner .main_text div.l_2 {height:66px;}
}

@media (max-width:320px){
	#top_banner .main_text{width:280px !important;}
	#top_banner .main_text > div {font-size:10vw;}
	#top_banner .main_text div.l_2 {height:56px;}
}