@charset "UTF-8";

/* layout */
html,
body{height: 100%;}
#wrap{padding-top: 57px;}
@media  (min-width: 768px){
	body{min-height: 1000px;}
	#wrap{height: 100%;}
}
.pa-center.main header{padding: 26px 0; height: auto}
@media only screen and (max-width: 767px){
	.pa-center.main header{padding: 12px 0;}
}
@media (max-width: 1720px){
	header .header-wrap,
	#wrap.pa-center.main footer .footer-wrap {padding: 0 75px;}
}
@media (max-width: 767px){
	header .header-wrap							{padding: 0 23px 0 19px;}
	#wrap.pa-center.main footer .footer-wrap	{padding: 0 25px; }
}


/* header */
header .header-wrap h1{padding-top: 0;}
.pa-center.main header .header-wrap h1 a{background: transparent; margin: 0; padding: 0}
#wrap.pa-center.main header .header-wrap h1 a,
#wrap.pa-center.main header .header-wrap h1 a{background: transparent !important;}
@media only screen and (max-width: 960px){
	header .header-wrap h1{float: left}
	header .header-wrap .right-wrap { float: right;}
	header .header-wrap .right-wrap .login-area {position: static; float: right; margin: 0; padding: 0;}
}
.pa-center.main header .header-wrap h1 a img{display: block;}
header .header-wrap .right-wrap a{}
header .header-wrap .right-wrap .login-area{padding-top: 0}
header .header-wrap .right-wrap .login-area .log-in,
.pa-center.main header .header-wrap .right-wrap .login-area .join{line-height: 29px; font-size: 14px; letter-spacing: -0.56px; color: #000}
.pa-center.main header .header-wrap .right-wrap .login-area .join{opacity: .4;}
@media only screen and (max-width: 960px){
	.pa-center header .header-wrap h1 {text-align: left;}
}
@media only screen and (min-width: 768px){
	.pa-center.main header .header-wrap h1 a{width: 121px;}
	.pa-center.main header .header-wrap h1 a img{width: 121px; height: 31px}
}
@media only screen and (max-width: 767px){
	.pa-center.main header{padding: 12px 0;}
	.pa-center.main header .header-wrap h1 a{width: 140px;}
	.pa-center.main header .header-wrap h1 a img{width: 140px; height: 36px}
}

/* footer */
.pa-center footer{border-top: 0; padding-top: 0; padding-bottom: 52px;}
.pa-center footer .footer-wrap {
	display: -ms-flexbox; display: -webkit-flex; display: flex;
}
.pa-center footer .footer-wrap .logo{background: transparent; position: static; padding-right: 144px;}
.pa-center footer .footer-wrap .rules li a{font-size: 14px; letter-spacing: -0.56px; color: #8d8d8d;}
.pa-center footer .footer-wrap .copyright{padding: 0 5px 0 0;  font-size: 13px; color: #8d8d8d;}
@media only screen and (max-width: 767px){
	.pa-center footer{background: #ececec; padding-top:30px;}
}

@media only screen and (max-width: 960px){
	.pa-center footer .footer-wrap .logo img {display: block; height: 28px;}
	#wrap.pa-center footer .footer-wrap .rules li{width: 100%;}
	.pa-center footer .footer-wrap .logo { height: auto; padding-bottom: 9px; border-bottom-color: #b9b9b9; background: transparent;}
	.pa-center footer .footer-wrap .rules { padding-top: 22px; padding-right: 0; }
	.pa-center footer .footer-wrap .copyright{margin-top: 50px;}
}
@media only screen and (min-width: 981px){
	.pa-center footer .footer-wrap {padding: 0;
		-webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between;
		-webkit-align-items: center; -ms-flex-align: center; align-items: center;
	}
	.pa-center footer .footer-wrap .rules{width: calc(100% - 241px - 272px);}
}
@media only screen and (max-width: 980px){
	.pa-center footer .footer-wrap {
		-webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column;
		-webkit-justify-content: flex-start; -ms-flex-pack: start; justify-content: flex-start;
		-webkit-align-items: stretch; -ms-flex-align: stretch; align-items: stretch;
	}
}

/* health-note */
body {background: url(../images/note/bg_note.svg) 100% 100% no-repeat;}
#wrap.pa-center,
#content.health-note .btn{
	box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
}
#wrap.full.pa-center.main #content.health-note	{overflow: hidden; max-width: 1608px; padding: 170px 150px 278px; height: calc(100% - 80px); min-height: 920px;}
#content.health-note h2{font-size: 49px; font-weight: bold; line-height: 1.39; letter-spacing: -2.45px; color: #000;}
#content.health-note img{display: block;}
#content.health-note .logo{margin: 32px 0 54px;}
#content.health-note .btn{display: block; width: 267px; height: 70px; line-height: 70px; text-align: center; border-radius: 34px; background-color: #000; font-size: 20px; font-weight: 500; letter-spacing: -0.8px; color: #fff;}
@media only screen and (min-width: 768px){
	#content.health-note .people{position: fixed; bottom: 130px; right: 42px; width: 1057px;}
}
@media only screen and (max-width: 767px){
	body {background: transparent;}
	#wrap.full.pa-center.main #content.health-note	{min-width: 360px; padding: 62px 25px 13.333vw !important; height: auto; min-height: 713px; background: url(../images/note/bg_note.svg) 100% 100% no-repeat; background-size: 164.267vw auto;}
	#content.health-note h2{font-size: 36px; line-height: 1.28; letter-spacing: -1.8px;}
	#content.health-note .logo{margin: 15px 0 31px; width: 249px;}
	#content.health-note .btn{display: block; width: 178px; height: 50px; line-height: 50px; font-size: 15px; letter-spacing: -0.6px; }
	#content.health-note .people{margin: 47.733vw 0 0 -9.067vw; width: 158.400vw}
}
@media only screen and (max-width: 414px){
	#wrap.full.pa-center.main #content.health-note	{padding-bottom: 50px !important; background-position: 80% 100%; background-size: 616px auto;}
	#content.health-note .people					{margin-top: 179px; width: 594px}
}
@media only screen and (max-width: 980px){
	body{background-size: 164.267vw}
}