@charset "utf-8";

#main #container{ width:100%; }

/* sec01 */
#main .sec01{ padding-top:40px; padding-bottom:20px; }
#main .sec01 .bx_wrap{ margin:0 auto; width:100%; max-width:335px; }
#main .sec01 .bx{ position:relative; display:block; margin:0 auto; width:100%; padding-bottom:calc(100% - 40px); border:20px solid #fafafa; border-radius:50%; box-sizing:border-box; }
#main .sec01 .bx a{ position:absolute; left:0; top:0; width:100%; height:100%; border:20px solid #e4e4e4; border-radius:50%; box-sizing:border-box; background: #Fc6c00; background: -moz-linear-gradient(-45deg,  #Fc6c00 1%, #Fc6c00 100%); background: -webkit-linear-gradient(-45deg,  #Fc6c00 1%,#Fc6c00 100%); background: linear-gradient(135deg,  #Fc6c00 1%,#Fc6c00 100%);filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#Fc6c00', endColorstr='#Fc6c00',GradientType=1 );}
#main .sec01 .bx a strong{ display:block; padding-top:80px; font-size:20px; line-height:25px; color:#fff; letter-spacing:-0.05em; text-align:center; font-weight:800; font-family: 'NanumSquare', sans-serif; background:url('../images/main/main_sec01_icon.png') no-repeat center 30px; background-size:15px auto;}
#main .sec01 .bx a:after{ content:''; position:absolute; width:31px; height:10px; bottom:45px; left:50%; margin-left:-15px; background:url('../images/btn/btn_ar_w.png') no-repeat center; background-size:31px auto;}
#main .sec01 .bx input{ position:absolute; left:50%; bottom:100px; padding:10px 0; width:60%; height:50px; font-size:25px; line-height:30px; color:#222; background:#fff; border-radius:25px; text-align:center; border:0; box-sizing:border-box; transform:translateX(-50%); -webkit-transform:translateX(-50%); -moz-transform:translateX(-50%); font-weight:700; }

/* sec02 */
#main .sec02{ position:relative; }
#main .sec02:after{ content:''; position:absolute; left:0; top:50%; width:100%; height:50%; background:#eee; z-index:-1; }
#main .sec02 ul{ margin-right:-10px; font-size:0; }
#main .sec02 ul li{ display:inline-block; vertical-align:top; width:calc(33.33% - 10px); margin-right:10px; }
#main .sec02 ul li a{ display:block; min-height:125px; font-size:15px; line-height:20px; color:#fff; text-align:center; font-family: 'NanumSquare', sans-serif; letter-spacing:-0.05em; font-weight:800; border-radius:10px; box-sizing:border-box; box-shadow:0 5px 8px rgba(0,0,0,.2);}
#main .sec02 ul li a p{ padding-top:85px; }
#main .sec02 ul li.li01 a{ background:#fff; }
#main .sec02 ul li.li02 a{ background:#fff; }
#main .sec02 ul li.li03 a{ background:#fff; }

#main .sec02 ul li a p {color: #212121;}
#main .sec02 ul li.li01 a p{ background:url('../images/main/sec02_icon01.png') no-repeat center 22px; background-size:37px auto; }
#main .sec02 ul li.li02 a p{ background:url('../images/main/sec02_icon02.png') no-repeat center 27px; background-size:50px auto; }
#main .sec02 ul li.li03 a p{ background:url('../images/main/sec02_icon03.png') no-repeat center 22px; background-size:46px auto; }

/* sec03 */
#main .sec03{ padding:25px 0 50px; background:#eee; }
#main .sec03 a{ position:relative; display:block; padding:25px 20px 0; min-height:115px; font-size:20px; line-height:25px; color:#212121; font-weight:800; letter-spacing:-0.05em; background:#fff; border-radius:10px; box-sizing:border-box; font-family: 'NanumSquare', sans-serif; box-shadow:0 5px 8px rgba(0,0,0,.2); }
#main .sec03 a:before{ content:''; position:absolute; left:20px; bottom:25px; width:31px; height:10px; background:url('../images/btn/btn_ar_w.png') no-repeat center; background-size:31px auto; }
#main .sec03 a:after{ content:''; position:absolute; right:23px; bottom:28px; width:68px; height:46px; background:url('../images/main/sec03_icon01.png') no-repeat center; background-size:68px auto; }

/* sec04 */
#main .sec04 {margin-bottom: 25px;height: 45px;}
#main .sec04 a{padding-left: 20px; padding-right: 50px; position: relative; display:block; cursor: pointer; vertical-align: middle;font-size: 16px; line-height: 45px;color: #212121;font-weight: 800;border-radius: 14px;box-shadow: 0 5px 8px rgba(0, 0, 0, .2);}
#main .sec04 .qr-icon {position: absolute;right: 12px;top: 50%;transform: translateY(-50%);width: 25px; height: 25px;}


@media all and (max-width:350px){

	/* sec01 */
	#main .sec01{ padding-top:30px; padding-bottom:15px; }
	#main .sec01 .bx{ padding-bottom:calc(100% - 30px); border:15px solid #fafafa; }
	#main .sec01 .bx a{ border:15px solid #e4e4e4; }
	#main .sec01 .bx a strong{ padding-top:70px; font-size:17px; line-height:21px; background:url('../images/main/main_sec01_icon.png') no-repeat center 25px; background-size:13px auto;}
	#main .sec01 .bx a:after{ width:31px; height:10px; bottom:35px; left:50%; margin-left:-15px; background:url('../images/btn/btn_ar_w.png') no-repeat center; background-size:31px auto;}
	#main .sec01 .bx input{bottom:80px; padding:7px 0; height:44px; font-size:22px; line-height:30px; border-radius:22px;}

	/* sec02 */
	#main .sec02 ul{ margin-right:-5px; }
	#main .sec02 ul li{ width:calc(33.33% - 5px); margin-right:5px; }
	#main .sec02 ul li a{ min-height:110px; }
	#main .sec02 ul li a p{ padding-top:75px; }

	/* sec03 */
	#main .sec03{ padding:20px 0 40px; }

	/* sec04 */
	#main .sec04 {margin-bottom: 20px;height: 42px;}
	#main .sec04 a{font-size: 15px; line-height: 42px;}
	#main .sec04 .qr-icon {width: 23px; height: 23px;}
}