@charset "utf-8";

/****** 공통 ******/
/*header*/
@media screen and (max-width:480px){
	.header {height: 70px;}
	.header h1 {padding-top: 14px;}
	.header ul li:nth-child(1) {top: 23px; left: 20px;}
	.header ul li:nth-child(1) a img {width: 80%;}
	.header ul li:nth-child(2) {width: 110px; height: 25px; top:18px; font-size: 15px;}
	.header ul li:nth-child(2) a {line-height: 26px;}
	.header ul li:nth-child(2) a span img {padding-left: 14px; width: 16%;}
}
@media screen and (max-width:380px){
	.header {height: 50px;}
	.header h1 {padding-top: 8px;}
	.header h1 a img {width: 70%; margin-left: 20px;}
	.header ul li:nth-child(1) {top: 13px; left: 16px;}
	.header ul li:nth-child(2) {width: 80px; top:9px; font-size: 13px;}
	.header ul li:nth-child(2) a {line-height: 25px;}
	.header ul li:nth-child(2) a span {margin-right: 4px;}
	.header ul li:nth-child(2) a span img {padding-left: 9px; width: 18%;}
}
@media screen and (max-width:320px){
	.header ul li:nth-child(2) a span {margin-right: 0;}
}

/*content*/
/*content_section_1*/
@media screen and (max-width:680px){
	.content .section_1 {min-height: 628px;}
	.tabs_default {width: 85%; margin: 0 14%;}
	.tabs_default div.product_list {width: 100%;}
	.tabs_default div.product_list ul {padding-bottom: 7px;}
	.tabs_default div.product_list ul li {width: 40%; margin-right: 30px;}
	.tabs_default div.product_list ul li a img {width: 100%;}
	.tabs_btn {width: 125%; margin: 0 -8%; padding-top: 0;}
	.tabs_btn li {width: 20%}
}
@media screen and (max-width:580px){
	.content .section_1 {min-height: 550px;}
	.tabs_default div.product_list ul {padding-bottom: 0; }
	.tabs_default div.product_list ul li {margin-right: 25px;}
	.tabs_default div.product_list ul li a p span {bottom: 23px; font-size: 15px;}
}
@media screen and (max-width:480px){
	.content .section_1 {min-height: 450px;}
	.tabs_default div.product_list ul li a p span {font-size: 14px;}
	.tabs_default div.product_list {padding-bottom: 2%;}
}
@media screen and (max-width:420px){
	.content .section_1 {min-height: 410px; background: url(../image/title_typo_bg.png) no-repeat center 20px; background-size:70%; background-color: #7591f8;}
	.tabs_default div.product_list {margin-left: -2%;}
	.
}
@media screen and (max-width:380px){
	.content .section_1 {min-height: 350px;}
	.content .section_1 {background: url(../image/title_typo_bg.png) no-repeat center 17px; background-size:60%; background-color: #7591f8;}
	.tabs_default {margin: 0 10.5%; padding-top: 5%;}
	.tabs_default div.product_list {margin-left: 1%;}
	.tabs_default div.product_list ul li {margin-right: 32px;}
	.tabs_default div.product_list ul li a p span {font-size: 13px;}
	.tabs_btn {margin: 0 -5%;}
	.tabs_btn li {width: 20.5%;}
}
@media screen and (max-width:320px){
	.content .section_1 {min-height: 300px;}
	.tabs_default div.product_list {margin-left: 2%;}
	.tabs_default div.product_list ul li {margin-right: 22px;}
	.tabs_btn {margin: 0 -4%;}
}

/*content_section_2*/
@media screen and (max-width:580px){
	.section_2 {background-size: 59%;}
	.section_2 h2 {font-size: 20px;}
	.section_2 ul {width: 92%}
	.section_2 ul li:first-child {margin: 0 50px 30px 0;}
	.section_2 ul li a p span {letter-spacing: -1px;}
}
@media screen and (max-width:480px){
	.section_2 {background: url(../image/insta_bg.png) no-repeat center 180px; background-size: 50%; background-color: #ff9696; padding-bottom: 10px;}
	.section_2 h2 {font-size: 17px; padding: 35px 0 15px 0;}
	.section_2 ul {width: 85%; margin:7% 14.5%;}
	.section_2 ul li {width: 45%;}
	.section_2 ul li:first-child {margin: 0;}
	.section_2 ul li a img {width: 85%; text-align: center;}
	.section_2 ul li a p span {font-size: 15px;}
	.section_2 ul li a p {width: 85%;}
}
@media screen and (max-width:420px){
	.section_2 {background: url(../image/insta_bg.png) no-repeat center 147px; background-size: 50%; background-color: #ff9696;}
	.section_2 h2 {font-size: 15px; padding: 20px 0 10px 0;}
	.section_2 ul li a p span {font-size: 14px;}
}
@media screen and (max-width:380px){
	.section_2 {background: url(../image/insta_bg.png) no-repeat center 140px; background-size: 50%; background-color: #ff9696;}
	.section_2 h2 {font-size: 13px; padding: 20px 0 10px 0;}
	.section_2 ul li a p span {font-size: 13px;}
	.section_2 ul li a img {margin-bottom: 10px;}
}
@media screen and (max-width:320px){
	.section_2 {background: url(../image/insta_bg.png) no-repeat center 125px; background-size: 50%; background-color: #ff9696;}
	.section_2 h2 {font-size: 13px; letter-spacing: -1.5px;}
	.section_2 h2 {visibility: none;}
	.section_2 h2 span {font-weight: bolder;}
	.section_2 ul li a p span {font-size: 13px; letter-spacing: -2px;}
}

/****** sub ******/
@media screen and (max-width:680px){
	.content .sub_title h2 span {font-size: 14px;}
	.sub_section_1 ul {width: 97%;}
	.sub_section_1 ul:nth-child(2) {width: 85%;}
}
@media screen and (max-width:580px){
	.content .sub_title h2 span {letter-spacing: -2px;}
	.sub_section_1 ul {width: 97%;}
	.sub_section_1 ul:nth-child(1) li {width: 18%; margin-left: 8px;}
}
@media screen and (max-width:480px){
	.content .sub_title {width: 100%;}
	.sub_section_1 ul:nth-child(1) li:first-child {padding-left: 20px;}
	.sub_section_1 ul:nth-child(1) li {font-size: 15px; margin-left: 0;}
}
@media screen and (max-width:420px){
	.content .sub_title h2 {font-size: 23px;}
	.content .sub_title h2 span {font-size: 13px;}
}
@media screen and (max-width:380px){
	.content .sub_title h2 {padding-top: 15px; padding-bottom: 33px;}
	.content .sub_title h2 span {font-size: 13px; }
	.content .sub_title {border-bottom-left-radius: 0; border-bottom-right-radius: 0;}
	.sub_section_1 ul:nth-child(1) li:first-child {padding-left: 10px;}
	.sub_section_1 ul:nth-child(1) li {letter-spacing: -1px;}
}
@media screen and (max-width:320px){
	.content .sub_title h2 span {font-size: 12px;}
	.sub_section_1 ul:nth-child(1) li {font-size: 13px; letter-spacing: -1px;}
}

/*footer*/
@media screen and (max-width:480px){
	.footer p:first-child {background-size: 70px;}
}
@media screen and (max-width:420px){
	.footer p:first-child {background-size: 60px;}
	.footer p + p {font-size: 14px; letter-spacing: -1px;}
}
@media screen and (max-width:320px){
	.footer p:first-child {background-size: 50px;}
	.footer p + p {font-size: 12px; letter-spacing: -1px;}
}