@charset "utf-8";

.main { height: 927px; }

.main_title { width: 100%; padding: 92px 0px 104px 0px; text-align: center }
.main_title img { width:217px ; height:34.5px; cursor: pointer }

.main_box { width: 360px; height: 580px; background-color: #ffffff; float: left; cursor: pointer }
.main_box:nth-child(2) { margin: 0px 60px 0px 60px }
.main_box div:nth-child(1) { padding: 20px 22px 0px 0px; font-size: 16px; font-weight: 100; letter-spacing: 0.4px; line-height: 24px; text-align: right;  }
.main_box div:nth-child(2) { padding: 74px 0px 0px 42px; font-size: 28px; font-weight: 600; letter-spacing: 0.56px; line-height: 30px; }
.main_box div:nth-child(3) { padding: 16px 0px 0px 42px; font-size: 16px; font-weight: lighter; letter-spacing: -0.4px; color: #919191 }
.main_box div:nth-child(4) { padding: 30px 0px 0px 0px }
.main_box div:nth-child(4) img { width: 320px; height: 290px; }
.main_box_list::after{ content:""; display: block; clear:both; }

.main_bg { position:absolute; top:0px; width: 100%; height: 927px; z-index: -1; background:url('/img/main/bg.png') top center no-repeat; background-size: cover }
.main_bg img { margin: 130px 920px 0px 0px; }
.main_bg div div { width: 100%; height: 927px; margin: 0px 0px 0px -200px; background:url('/img/main/bg_olivestar.png') 0px 100px no-repeat; }

.bottom_bg { margin: 0px 0px 0px 0px; }

/* content 폭 */
@media all and (max-width:1200px)
{
	.main_bg { background-position: top left -360px; }
}

/* 모바일 */
@media all and (max-width:640px)
{
	.main { height: auto; padding: 0px 0px 50px 0px; background-color: #F5F0EF }
	.main_title { padding: 32px 0px 12px 0px; }
	.main_box { position: relative; width: 90%; height: auto; float: none; margin: 20px 5% 20px 5%; }
	.main_box:nth-child(2) { margin: 20px 5% 20px 5% }
	.main_box div:nth-child(1) {padding: 10px 0px 0px 15px;font-size: 12px; text-align: left }
	.main_box div:nth-child(2) {padding: 30px 0px 0px 15px;font-size: 24px;}
	.main_box div:nth-child(3) {padding: 10px 0px 0px 15px;font-size: 12px;}
	.main_box div:nth-child(4) { position: absolute; top:0px; right: 0px; width: 55%; padding: 0px }
	.main_box div:nth-child(4) img { width: 100%; height: auto; }
}

@media all and (max-width:360px)
{
	.main_box div:nth-child(1) { padding: 10px 0px 0px 10px; font-size: 10px; }
	.main_box div:nth-child(2) { padding: 30px 0px 0px 10px; font-size: 19px }
	.main_box div:nth-child(3) { padding: 0px 0px 0px 10px; font-size: 11px }
}
