@charset "UTF-8";

@media screen and (max-width:1600px){
	.sns_list {right: -125px;}
	.sns_list > li {-webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s;}
	.sns_list > li:hover {right: 125px;}
	.sns_list > li a {width: 200px;}
	.sns_list > li a:hover {width: 310px;}
}

@media screen and (max-width:1280px){
	.kakao_box {right: 20px;}



	/*½Å±Ô ½ºÅ¸ÀÏ*/
	.row2_link_btn_wrap .btn_box a p {font-size: 1.750em;}
	.row4 .octagon_btn_wrap .octagon_btn a p {font-size: 1.25em;}

	.svg_cont_wrap .svg_cont .R_cont p {font-size: 1.25em;}

	.is-ie .svg_cont_wrap #svg_wrap {  height: 38vw;}


}

@media screen and (max-width:991px){
	.header.scrolled {padding-top: 70px;}

	.main_tit {font-size: 2.3em;}

	.sns_list {right: -140px;}
	.sns_list > li:hover {right: 140px;}
	.sns_list > li a {height: 60px; line-height: 60px; font-size: 1.2em;}
	.sns_list > li a:hover {width: 260px;}
	.sns_list > li.kakao a:before {width: 34px; margin-left: 18px;}
	.sns_list > li.find a:before {width: 34px; margin-left: 18px;}
	.sns_list > li.facebook {top: 73px;}
	.sns_list > li.facebook a:before {width: 18px; margin-left: 26px; margin-right: 18px;}
	.sns_list > li.instagram {top: 147px;}
	.sns_list > li.instagram a:before {width: 25px; margin-left: 24px; margin-right: 13px;}
	.sns_list > li.youtube {top: 147px;}
	.sns_list > li.youtube a:before {width: 25px; margin-left: 24px; margin-right: 13px;}

	.row1 {padding: 50px 0;}
	.row2 .shapes .shape1 {width: 150px; left: -60px; top: -44px;}
	.row2 .shapes .shape2 {left: 28px; top: 96px;}
	.row1 .total_sch_box .img {width: 200px;}
	.row1 .total_sch_box input {height: 90px; padding-left: 240px; padding-right: 90px; font-size: 1.3em;}
	.row1 .total_sch_box label {left: 30px; height: 40px; line-height: 40px; margin-top: -20px; padding-right: 30px; font-size: 1.7em;}
	.row1 .total_sch_box .total_sch_btn {right: 30px;}

	.row2 {padding: 50px 0;}
	.row3 .shapes .shape3 {width: 303px; right: -200px; top: -133px;}
	.row3 .shapes .shape4 {right: 56px;}
	.row2 .tag_list > li a {width: 200px; height: 232px;}
	.row2 .tag_list > li a:before {width: 242px; height: 274px; background-size: 236px 271px, 200px 232px;}
	.row2 .tag_list > li .txt {margin-top: 5px; font-size: 2em;}
	.row2 .tag_list > li .txt em {margin-top: 10px; font-size: 16px;}
	.row2 .tag_list > li:nth-child(1) .txt:before {top: -30px; font-size: 16px;}
	.row2 .tag_list > li:nth-child(1) a:after {width: 40px; height: 42px;}
	
	.row3 {padding: 50px 0;}
	.row3 .main_tit {margin-bottom: 30px;}
	.row3 .more_list > li a {height: 280px;}
	.row3 .more_list > li .txt_box .tit {font-size: 2em;}
	.row3 .more_list > li .txt_box .btn {width: 170px; height: 45px; line-height: 45px; font-size: 1.1em;}

	.row3 .more_list > li.li01 .img_box {width: 160px; left: 30px;}

	.row3 .more_list > li.li02 .img_box {width: 220px; left: 30px;}
	.row3 .more_list > li.li02 .img_box:after {width: 60px; height: 60px;}

	.row3 .more_list > li.li03 .img_box {width: 210px; left: 20px;}
	
	.row3 .more_list > li.li04 .img_box {width: 120px; left: 40px;}



	/*½Å±Ô ½ºÅ¸ÀÏ*/
	.row2_link_btn_wrap .btn_box {width: 46%; margin: 2%; padding-bottom: 46%;}
	.row2_link_btn_wrap .btn_box.box4 {margin: 2%;}
	.row2_link_btn_wrap .btn_box a p {bottom: 30px;}



	#svg_wrap {display: none;}
	.svg_cont_wrap .svg_cont {position: static; width: 100%; max-width: 350px; margin: 0 auto 15px; padding: 15px 0 15px 50px; 	}
	.svg_cont_wrap .svg_cont1 {height: auto; background-image: url('/images/main/pattern1.jpg');}
	.svg_cont_wrap .svg_cont2 {height: auto; background-image: url('/images/main/pattern2.jpg'); }
	.svg_cont_wrap .svg_cont3 {height: auto; background-image: url('/images/main/pattern3.jpg');}
	/*.svg_cont_wrap .svg_cont4 {height: auto; background-image: url('/images/main/pattern4.jpg');}*/
	.svg_cont_wrap .svg_cont4 {display: none;}
	.svg_cont_wrap .svg_cont5 {height: auto; background-image: url('/images/main/pattern5.jpg');}

 	.svg_cont_wrap .svg_cont .R_cont {position: static; left: 0; top: 0; width: 100%; display: block; -webkit-transform: translate(0,0); -moz-transform: translate(0,0); -ms-transform: translate(0,0); -o-transform: translate(0,0); transform: translate(0,0); overflow: hidden; text-align: left;}
	.svg_cont_wrap .svg_cont .R_cont .img {display: inline-block; width: 70px;}
	.svg_cont_wrap .svg_cont .R_cont p {display: inline-block; color: #000; }

	.svg_cont_wrap .svg_cont1 .img {width: 80px;}

	.svg_cont_wrap .svg_cont .R_cont.over {-webkit-transform: translate(0,0) scale(1); -moz-transform: translate(0,0) scale(1); -ms-transform: translate(0,0) scale(1); -o-transform: translate(0,0) scale(1); transform: translate(0,0) scale(1); z-index: 111;}


	.svg_cont_wrap .svg_cont5 {display: none !important; margin: 0;}

	
}

@media screen and (max-width:767px){
	.main_tit {margin-bottom: 30px; font-size: 2em;}

	.row1 .total_sch_box .img {width: 140px;}
	.row1 .total_sch_box input {height: 70px; padding-left: 170px; padding-right: 60px; font-size: 1.2em;}
	.row1 .total_sch_box label {left: 20px; height: 35px; line-height: 35px; padding-right: 20px; margin-top: -17.5px; font-size: 1.5em;}
	.row1 .total_sch_box .total_sch_btn {right: 20px; width: 30px;}

	.row2 .tag_list > li {margin: 5px;}
	.row2 .tag_list > li a {width: 170px; height: 202px;}
	.row2 .tag_list > li a:before {width: 212px; height: 244px; background-size: 200px 235px, 170px 202px;}
	.row2 .tag_list > li .txt {font-size: 1.6em;}
	.row2 .tag_list > li:nth-child(1) .txt:before {font-size: 15px;}
	.row2 .tag_list > li .txt em {font-size: 15px;}


	.row3 .more_list > li {width: 100%; margin-right: 0; margin-top: 1.8%;}
	.row3 .more_list > li:first-child {margin-top: 0;}
	.row3 .more_list > li .txt_box {width: 200px; right: 10% !important;}

	.row3 .more_list > li.li01 .img_box {left: 7%;}

	.row3 .more_list > li.li02 .img_box {left: 6%;}

	.row3 .more_list > li.li03 .img_box {left: 7%;}

	.row3 .more_list > li.li04 .img_box {left: 11%;}


	/*½Å±Ô ½ºÅ¸ÀÏ*/
	.row4 .octagon_btn_wrap .octagon_btn {width: 27%; margin: 0 3.1% 2%; padding-bottom: 27%;}
	.row4 .octagon_btn_wrap .octagon_btn:last-child {margin: 0 3.1% 2%;}


}

@media screen and (max-width:640px){



	/*½Å±Ô ½ºÅ¸ÀÏ*/
	.row2_link_btn_wrap .btn_box {padding-bottom: 56%;}
	.row2_link_btn_wrap .btn_box a {padding: 30px 0 70px;}
	.row2_link_btn_wrap .btn_box a p {font-size: 1.25em;}
	.row2_link_btn_wrap .btn_box a .img_box:after {width: 55px; height: 55px;}
}

@media screen and (max-width:480px){
	.sns_list {right: -155px;}
	.sns_list > li:hover {right: 155px;}
	.sns_list > li a {height: 50px; line-height: 50px; font-size: 1.067em;}
	.sns_list > li a:hover {width: 210px;}
	.sns_list > li.kakao {top: 10px;}
	.sns_list > li.kakao a:before {width: 24px; margin-left: 15px;}
	.sns_list > li.find {top: 10px;}
	.sns_list > li.find a:before {width: 24px; margin-left: 15px;}
	.sns_list > li.facebook {top: 65px;}
	.sns_list > li.facebook a:before {width: 13px; margin-left: 21px; margin-right: 12px;}
	.sns_list > li.instagram {top: 120px;}
	.sns_list > li.instagram a:before {width: 20px; margin-left: 18px; margin-right: 8px;}
	.sns_list > li.youtube {top: 120px;}
	.sns_list > li.youtube a:before {width: 20px; margin-left: 18px; margin-right: 8px;}

	.row1 .total_sch_box .img {display: none;}
	.row1 .total_sch_box input {padding-left: 20px;}
	.row1 .total_sch_box label {display: none;}

	.row2 .shapes {display: none;}
	.row2 .tag_list > li {width: 45%;}
	.row2 .tag_list > li a {width: 100%; height: 170px;}
	.row2 .tag_list > li a:before {width: 100%; height: 100%; background-position: -200px -200px, center; background-size: contain, contain;}
	.row2 .tag_list > li .txt {font-size: 1.5em;}
	.row2 .tag_list > li:nth-child(1) .txt:before {font-size: 14px;}
	.row2 .tag_list > li .txt em {font-size: 14px;}
	.row2 .tag_list > li:hover a {-webkit-transform: translateY(-10px); -moz-transform: translateY(-10px); -o-transform: translateY(-10px); transform: translateY(-10px);}
	.row2 .tag_list > li:nth-child(1) a:after {width: 35px; height: 37px; left: 0px;}

	.row3 .shapes {display: none;}
	.row3 .more_list > li a {height: 250px;}
	.row3 .more_list > li .txt_box {width: 160px; right: 7% !important;}
	.row3 .more_list > li .txt_box .tit {margin-bottom: 20px ;font-size: 1.4em;}
	.row3 .more_list > li .txt_box .t1 {margin-bottom: 10px; font-size: 1em;}
	.row3 .more_list > li .txt_box .btn {width: 153px; height: 40px; line-height: 40px; font-size: 1em;}

	.row3 .more_list > li.li01 .img_box {width: 130px;}
	
	.row3 .more_list > li.li02 .img_box {width: 155px;}
	.row3 .more_list > li.li02 .img_box:after {width: 50px; height: 50px;}
	
	.row3 .more_list > li.li03 .img_box {width: 140px;}
	
	.row3 .more_list > li.li04 .img_box {width: 100px;}


	/*½Å±Ô ½ºÅ¸ÀÏ*/
	.row4 .octagon_btn_wrap .octagon_btn {width: 40%; margin: 0 5% 2%; padding-bottom: 40%;}
	.row4 .octagon_btn_wrap .octagon_btn:last-child {margin: 0 5% 2%;}
	

	.svg_cont_wrap .svg_cont {position: static; width: 100%; max-width: 350px; margin: 0 auto 15px; padding: 15px 20px 15px; 	}
	
}

@media screen and (max-width:360px){
	
	.row3 .more_list > li a {height: 200px;}
	.row3 .more_list > li .txt_box {width: 140px; }
	.row3 .more_list > li .txt_box .tit {font-size: 1.4em;}
	.row3 .more_list > li .txt_box .btn {font-size: 0.933em;}

	.row3 .more_list > li.li01 .img_box {width: 110px; top: 35px;}

	.row3 .more_list > li.li02 .img_box {width: 115px;}
	.row3 .more_list > li.li02 .img_box:after {width: 40px; height: 40px;}

	.row3 .more_list > li.li03 .img_box {width: 130px; top: 55px;}
	
	.row3 .more_list > li.li04 .img_box {width: 90px; top: 30px;}

}