@charset "utf-8";


/* ==============================================
   layout
   ============================================== */

/* body */

#subBody {}


#subBody.faq .faq {background-image: url('../images/community/sub_visual.jpg');}


/* title area */

#subBody .titleArea {position: relative;display: flex;flex-direction: column;justify-content: center;align-items: center;height: 420px;color: #fff;text-align: center;background-position: center center;background-size: cover;background-repeat: no-repeat;}
#subBody.introduce .titleArea {background-image: url('../images/introduce/sub_visual.jpg');}
#subBody.human .titleArea {background-image: url('../images/human/survey_sub_visual.png');}
#subBody.community .titleArea {background-image: url('../images/community/sub_visual.jpg');}
#subBody.identity .titleArea {background-image: url('../images/member/sub_visual_identity.jpg');}
#subBody.join .titleArea {background-image: url('../images/member/sub_visual_join.jpg');}
#subBody.policy .titleArea {background-image: url('../images/member/sub_visual_policy.jpg');}
#subBody.mypage .titleArea {background-image: url('../images/mypage/sub_visual.jpg');}
#subBody .titleArea h2 {line-height: 32px;font-size: 24px;font-weight: 700;}
#subBody .titleArea h3 {line-height: 60px;font-size: 42px;font-weight: 700;}

/* contents */

#subBody .contents {}
#subBody .contents .conUnit {padding: 80px 0;}
#subBody .contents .conUnit .content {position: relative;}
#subBody .contents .subUnit {margin-top: 36px;}

#subBody .contents .topSlogan {margin-bottom: 80px;}
#subBody .contents .topSlogan span {display: block;text-align: center;}
#subBody .contents .topSlogan span.main {line-height: 46px;font-size: 36px;font-weight: 700;}
#subBody .contents .topSlogan span.main strong {color: #35c0d9;}
#subBody .contents .topSlogan span.exp {line-height: 25px;font-size: 18px;margin-top: 18px;}
#subBody .contents .topSlogan span.exp.panel {color: #5e6064}

#subBody .contents h4 {line-height: 43px;font-size: 36px;font-weight: 700;margin-bottom: 30px;}
#subBody .contents h5 {line-height: 24px;font-size: 18px;font-weight: 700;margin-bottom: 14px;}
#subBody .contents p.text {line-height: 24px;font-size: 18px;color: #5e6064;}
#subBody .contents p.comment {line-height: 20px;font-size: 14px;color: #83868d;}


/* mediaquery for tablet */

@media only screen and (max-width: 1240px) {

	/* title area */

	#subBody .titleArea {height: 260px;}
	#subBody .titleArea h2 {line-height: 28px;font-size: 20px;}
	#subBody .titleArea h3 {line-height: 46px;font-size: 32px;}

	/* contents */

	#subBody .contents .conUnit {padding: 80px 60px;}

}


/* mediaquery for tablet mini */

@media only screen and (max-width: 940px) {

	/* title area */

	#subBody .titleArea {height: 130px;}
	#subBody .titleArea h2 {line-height: 20px;font-size: 13px;}
	#subBody .titleArea h3 {line-height: 32px;font-size: 24px;}

	/* contents */

	#subBody img { max-width: 100%; height: auto; }
	#subBody br.block { display: block !important; }

	#subBody .contents .conUnit {padding: 70px 60px;}
	#subBody .contents .conUnit .content {}
	#subBody .contents .subUnit {margin-top: 30px;}

	#subBody .contents .topSlogan {margin-bottom: 40px;}
	#subBody .contents .topSlogan span.main {line-height: 34px;font-size: 24px; word-break: keep-all; }
	#subBody .contents .topSlogan span.exp {line-height: 20px;font-size: 15px;margin-top: 18px; word-break: keep-all; }

	#subBody .contents h4 {line-height: 34px;font-size: 24px;margin-bottom: 24px;}
	#subBody .contents h5 {line-height: 24px;font-size: 18px;font-weight: 700;margin-bottom: 14px;}
	#subBody .contents p.text {line-height: 20px;font-size: 15px;}
	#subBody .contents p.text  br { display: none; }
	#subBody .contents p.comment {line-height: 20px;font-size: 12px;}

}


/* mediaquery for mobile */

@media only screen and (max-width: 680px) {

	/* contents */

	#subBody .contents .conUnit {padding: 40px 25px;}
	#subBody .contents .subUnit {margin-top: 30px;}

	#subBody .contents .topSlogan {margin-bottom: 40px;}
	#subBody .contents .topSlogan span.main br { display: none; }
	#subBody .contents .topSlogan span.exp br { display: none; }

}



/* ==============================================
   survey layout
   ============================================== */

/* header */

#surveyHeader {}
#surveyHeader h1 {position: absolute;left: 40px;top: 30px;width: 112px;z-index: 99;}
#surveyHeader h1 a {display: block;/*height: 16px;*/text-indent: -9999px;background: url('../images/common/logo_white.svg') left center no-repeat;background-size: 111px auto;}

/* body */

#surveyBody {}

/* title area */

#surveyBody .titleArea {position: relative;display: flex;flex-direction: column;justify-content: flex-start;align-items: center;height: 510px;color: #fff;text-align: center;background-position: center center;background-size: cover;background-repeat: no-repeat;padding-top: 195px;}
#surveyBody.ability .titleArea {background-image: url('../images/ability/survey_sub_visual.png');}
#surveyBody.human .titleArea {background-image: url('../images/human/survey_sub_visual.png');}
#surveyBody.culture .titleArea {background-image: url('../images/culture/survey_sub_visual.png');}
#surveyBody .titleArea h3 {line-height: 56px;font-size: 42px;font-weight: 700;}
#surveyBody .titleArea p.exp {line-height: 28px;font-size: 18px;margin-top: 24px;}

/* contents */

#surveyBody .contents {width: 1200px;margin: 100px auto 150px;}

/* progress */

.surveyProgress {border-top: 1px solid #dbdbdb;margin-bottom: 30px;}
.surveyProgress ul {display: flex;}
.surveyProgress ul li {flex: 1 1 0;position: relative;height: 80px;line-height: 80px;color: #aaa;font-size: 20px;font-weight: 700;text-align: center;background-color: #f7f8fa;}
.surveyProgress ul li:after {content: "\e940";position: absolute;right: 0;top: 50%;width: 24px;height: 30px;line-height: 30px;font-size: 22px;color: #cdd0d3;text-align: right;font-family: xeicon;margin-top: -15px;
     transition: all 0.2s ease;
}
.surveyProgress ul li.complete:after,
.surveyProgress ul li.current:after,
.surveyProgress ul li:last-child:after {display: none;}
.surveyProgress ul li span {}
.surveyProgress ul li.complete {color: #ddd;border-right: 1px solid #8e8e8e;background-color: #a2a5a5;}
.surveyProgress ul li.current {color: #fff;background-color: #35c0d9;box-shadow: 0 9px 30px 0 rgba(0, 0, 0, 0.16);z-index: 2;}

/* example */

.surveyExample {background-color: #e8f6fa;padding: 50px; text-align: center;}
.surveyExample p.subject {line-height: 30px;font-size: 19px;text-align: center;margin-bottom: 16px;}
.surveyExample p.subject.noExample {padding: 10px 0;margin-bottom: 0;}
.surveyExample p.subject strong {color: #35c0d9;font-weight: 700;}
.surveyExample p.subject strong.darkBlue {color: #34598b;}
.surveyExample ul.example {display: flex;justify-content: center;}
.surveyExample ul.example li {vertical-align: middle;margin: 0 20px;}
.surveyExample ul.example li span.num {display:inline-block; display: -moz-inline-stack; zoom:1; *display:inline;width: 21px;height: 21px;line-height: 19px;font-size: 13px;text-align: center;vertical-align: middle;border: 1px solid #252d3a;margin-right: 6px;
	-moz-border-radius: 100%;
	-webkit-border-radius: 100%;
	border-radius: 100%;
}
.surveyExample ul.example li span.answer {display:inline-block; display: -moz-inline-stack; zoom:1; *display:inline;line-height: 21px;font-size: 18px;vertical-align: middle;}

/* survey list */

.surveyList {border-top: 1px solid #e5e9eb;}
.surveyList .item {position: relative;border-bottom: 1px solid #e5e9eb;padding: 70px 0;}
.surveyList .item p.subject {line-height: 30px;font-size: 20px;font-weight: 700;text-align: center;margin-bottom: 32px;}
.surveyList .item ul.select {display: flex;justify-content: center;align-items: center;}
.surveyList .item ul.select li {position: relative;margin-right: 55px;}
.surveyList .item ul.select li:last-child {margin-right: 0;}
.surveyList .item ul.select li input {display: none;
   -webkit-appearance: none;
   -moz-appearance: none;
   appearance: none;
}
.surveyList .item ul.select li input + label {display: block;width: 46px;height: 46px;line-height: 44px;font-size: 18px;color: #252d3a;text-align: center;border: 1px solid #252d3a;cursor: pointer;
	-moz-border-radius: 100%;
	-webkit-border-radius: 100%;
	border-radius: 100%;
     transition: all 0.2s ease;
}
.surveyList .item ul.select li input + label:hover {color: #35c0d9;border-color: #35c0d9;}
.surveyList .item ul.select li input:checked + label {color: #fff;font-weight: 700;border-color: #35c0d9;background-color: #35c0d9;}

.surveyList .item ul.select li.title {display: none;min-width: 100px;line-height: 30px;font-size: 20px;font-weight: 700;}

.surveyList .item ul.select.label li {display: flex;align-items: center;margin-right: 40px;}
.surveyList .item ul.select.label li input + label {flex: 0 0 auto;}
.surveyList .item ul.select.label li label.exp {line-height: 24px;font-size: 18px;margin-left: 8px;cursor: pointer;}

.surveyList .item ul.radioList {justify-content: center;align-items: center;}
.surveyList .item ul.radioList li {margin-right: 35px;}

.surveyList .item .input {display: flex;justify-content: center;align-items: center;}
.surveyList .item .input input.inputBasic {width: 405px;font-size: 18px;}
.surveyList .item .input input.inputBasic.small {width: 125px;}
.surveyList .item .input input.inputBasic + span.unit {font-size: 18px;margin-left: 18px;}

/* survey list - division */

.surveyList .divide {display: flex;justify-content: flex-end;border-bottom: 1px solid #e5e9eb;padding: 56px 0 15px;}
.surveyList .divide span {width: 310px;line-height: 32px;font-size: 20px;font-weight: 700;text-align: center;margin-left: 90px;}
.surveyList .divide span:first-child {margin-left: 0;}

.surveyList.division {}
.surveyList.division .item {display: flex;align-items: center;padding: 50px 0;}
.surveyList.division .item p.subject {text-align: left;margin-bottom: 0;margin-right: auto;}
.surveyList.division .item ul.select {margin-left: 40px;}
.surveyList.division .item ul.select:last-child {margin-left: 90px;}
.surveyList.division .item ul.select li {margin-right: 20px;}
.surveyList.division .item ul.select li:last-child {margin-right: 0;}
.surveyList.division .item ul.select li.title {margin-right: 0;}

/* survey score list */

.surveyScoreList {margin-top: 10px;}
.surveyScoreList .item {padding-top: 60px;}
.surveyScoreList .item .head {display: flex;height: 54px;}
.surveyScoreList .item .head p.subject {line-height: 34px;font-size: 26px;font-weight: 700;}
.surveyScoreList .item .head ul.division {display: flex;margin-left: auto;}
.surveyScoreList .item .head ul.division li {width: 125px;line-height: 26px;font-size: 18px;font-weight: 700;text-align: center;padding-top: 8px;margin-left: 10px;}

.surveyScoreList .item ul.questionList {}
.surveyScoreList .item ul.questionList li {display: flex;align-items: center;border-top: 1px solid #e5e9eb;padding: 10px 0;}
.surveyScoreList .item ul.questionList li p.question {line-height: 30px;font-size: 20px;}
.surveyScoreList .item ul.questionList li .score {display: flex;margin-left: auto;align-items: center}
.surveyScoreList .item ul.questionList li .score p {width: 125px;margin-left: 10px;}
.surveyScoreList .item ul.questionList li .score p input {width: 100%;font-size: 18px;text-align: center;}

.surveyScoreList .item .foot {display: flex;align-items: center;height: 82px;border: 1px solid #252d3b;border-width: 1px 0;}
.surveyScoreList .item .foot p.title {width: 73px;line-height: 26px;font-size: 18px;margin-left: auto;}
.surveyScoreList .item .foot ul.sum {display: flex;}
.surveyScoreList .item .foot ul.sum li {width: 125px;line-height: 26px;font-size: 18px;text-align: center;margin-left: 10px;}
.surveyScoreList .item .foot ul.sum li span {}

#surveyBody .contents > .btnList {margin-top: 80px;}
#surveyBody .contents > .btnList ul li a.btnRound {width: 172px;}

/* add 2022.12.15 */
.surveyScoreList.part4 .item ul.questionList li .score p {width: 221px;}
.surveyScoreList.part4 .item ul.questionList li .score p input {width: 100%;}
.surveyScoreList.part4 .item .score p {width: 221px;}
.surveyScoreList.part4 .item .score p input {width: 100%;}
.surveyScoreList.part4 .item {border-bottom:1px solid #252d3b;}
.surveyScoreList.part4 .item.subQuestion {border-bottom:1px solid #e5e9eb;}
.surveyScoreList.part4 .item .subject span {display:block; font-size: 16px; line-height: 24px; font-weight: 400; margin-top: 12px}
.surveyScoreList.part4 .item .score {display: flex;margin-left: auto;align-items: center;}
.surveyScoreList.part4 .item .score span {display: inline-block; width: 69px;padding-left: 17.5px;}
.surveyScoreList.part4 .item .head.withQuestion {height: auto;padding-bottom: 50px;}
.surveyScoreList.part4 .item.subQuestion .head.withQuestion {height: auto; align-items: center;padding-bottom:30px;}
.surveyScoreList.part4 .item.subQuestion .score > div {display: flex; align-items: center;}

.surveyScoreList.part4 .item .question {width: 253px;}
.surveyScoreList.part4 .item .answer {display: flex; margin-left: 0; align-items: center;}
.surveyScoreList.part4 .item .answer span {padding-left: 17.5px;}
.surveyScoreList.part4  ul.select.label {display: flex; flex-wrap: wrap; width: 947px; }
.surveyScoreList.part4  ul.select.label li {width: 235px; border:none}
.surveyScoreList.part5 .item ul.questionList li .score p {width: 221px;}
.surveyScoreList.part5 .item ul.questionList li .score p input {width: 100%;}
.surveyScoreList.part5 .item .score p {width: 221px;}
.surveyScoreList.part5 .item .score p input {width: 100%;}
.surveyScoreList.part5 .item {border-bottom:1px solid #252d3b;}
.surveyScoreList.part5 .item.subQuestion {border-bottom:1px solid #e5e9eb;}
.surveyScoreList.part5 .item .subject span {display:block; font-size: 16px; line-height: 24px; font-weight: 400; margin-top: 12px}
.surveyScoreList.part5 .item .score {display: flex;margin-left: auto;align-items: center;}
.surveyScoreList.part5 .item .score span {display: inline-block; width: 69px;padding-left: 17.5px;}
.surveyScoreList.part5 .item .head.withQuestion {height: auto;padding-bottom: 50px;}
.surveyScoreList.part5 .item.subQuestion .head.withQuestion {height: auto; align-items: center;padding-bottom:30px;}
.surveyScoreList.part5 .item.subQuestion .score > div {display: flex; align-items: center;}

.surveyScoreList.part5 .item .question {width: 253px;}
.surveyScoreList.part5 .item .answer {display: flex; margin-left: 0; align-items: center;}
.surveyScoreList.part5 .item .answer span {padding-left: 17.5px;}
.surveyScoreList.part5  ul.select.label {display: flex; flex-wrap: wrap; width: 947px; }
.surveyScoreList.part5  ul.select.label li {width: 235px; border:none}
ul.select.label li input {display: none;}
ul.select.label li input:checked + label {
    color: #fff;
    font-weight: 700;
    border-color: #35c0d9;
    background-color: #35c0d9;
}
ul.select.label li input + label {
    display: block;
    width: 46px;
    height: 46px;
    line-height: 44px;
    font-size: 18px;
    color: #252d3a;
    text-align: center;
    border: 1px solid #414853;
    cursor: pointer;
    -moz-border-radius: 100%;
    -webkit-border-radius: 100%;
    border-radius: 100%;
    transition: all 0.2s ease;
}
ul.select.label li label.exp {
    line-height: 24px;
    font-size: 18px;
    margin-left: 8px;
    cursor: pointer;
}
ul.select.label li input + label {
    flex: 0 0 auto;
}
/* survey complete */

.surveyCompleteBox {width: 1200px;background: #e8f6fa url('../images/common/icon_survey_complete.png') right 108px center no-repeat;padding: 145px 94px;margin: 200px auto;}
.surveyCompleteBox p.head {line-height: 46px;font-size: 36px;font-weight: 700;}
.surveyCompleteBox p.exp {line-height: 24px;font-size: 18px;color: #5e6064;margin-top: 18px;}



/* mediaquery for tablet */

@media only screen and (max-width: 1240px) {

	/* title area */

	#surveyBody br.block { display: block !important; }

	/* contents */

	#surveyBody .contents {width: auto;}

	/* example */

	.surveyExample br { display: none; }

	/* survey list */

	.surveyList .item ul.select li.title {display: block;}

	/* survey list - division */

	.surveyList .divide {display: none;}

	.surveyList.division {}
	.surveyList.division .item { flex-direction: column; align-items: flex-end;padding: 50px 70px;}
	.surveyList.division .item p.subject { position: absolute; left: 70px; top: 50%; width: calc(100vw - 600px); transform: translateY(-50%); }
	.surveyList.division .item ul.select { padding: 20px 0; margin-left: 0;}
	.surveyList.division .item ul.select:last-child {margin-left: 0;}

	/* survey score list */

	.surveyScoreList .item {padding: 50px 40px 0;}
	.surveyScoreList .item .head ul.division li {width: 94px;}

	.surveyScoreList .item ul.questionList li p.question {line-height: 24px;font-size: 18px;}
	.surveyScoreList .item ul.questionList li .score p {width: 94px;}

	.surveyScoreList .item .foot ul.sum li {width: 94px;}

	/* survey complete */

	.surveyCompleteBox {width: auto; background-position: center right 60px; background-size: 190px auto; padding: 120px 74px;margin: 140px 60px;}

}


/* mediaquery for tablet mini */

@media only screen and (max-width: 940px) {

	/* header */

	#surveyHeader h1 {left: 50%;top: 40px;width: 112px; margin-left: -56px; }

	/* body */

	#surveyBody {}

	/* title area */

	#surveyBody img { max-width: 100%; height: auto; }

	#surveyBody .titleArea {height: 510px;padding-top: 196px;}
	#surveyBody.ability .titleArea {background-image: url('../images/ability/survey_sub_visual_mobile@2x.jpg');}
	#surveyBody.human .titleArea {background-image: url('../images/human/survey_sub_visual_mobile@2x.jpg');}
	#surveyBody.culture .titleArea {background-image: url('../images/culture/survey_sub_visual_mobile@2x.jpg');}
	#surveyBody .titleArea h3 {line-height: 32px;font-size: 26px;}
	#surveyBody .titleArea p.exp { max-width: 284px; line-height: 22px;font-size: 15px;margin: 20px auto 0;}

	/* contents */

	#surveyBody .contents {width: auto;margin: 30px auto 90px;}

	/* progress */

	.surveyProgress {margin-bottom: 10px;}
	.surveyProgress ul li {height: 60px;line-height: 60px;font-size: 14px;}
	.surveyProgress ul li:after { right: -4px; width: 14px;height: 24px;line-height: 24px;font-size: 14px;margin-top: -12px; z-index: 9; }

	/* example */

	.surveyExample {padding: 50px 30px;}
	.surveyExample p.subject {line-height: 22px;font-size: 16px;text-align: left; word-break: keep-all; margin-bottom: 20px;}
	.surveyExample br { display: none; }
	.surveyExample p.subject.noExample { text-align: center; padding: 0;margin-bottom: 0;}
	.surveyExample ul.example { flex-wrap: wrap; justify-content: flex-start; margin-bottom: -15px; }
	.surveyExample ul.example li { width: 50%; margin: 0 0 15px 0;}
	.surveyExample ul.example li span.num {width: 19px;height: 19px;line-height: 17px;font-size: 12px;margin-right: 4px;}
	.surveyExample ul.example li span.answer {line-height: 19px;font-size: 15px;}

	/* survey list */

	.surveyList .item {padding: 60px 30px;}
	.surveyList .item p.subject {line-height: 22px;font-size: 16px;word-break: keep-all;margin-bottom: 28px;}
	.surveyList .item ul.select li {margin-right: 20px;}
	.surveyList .item ul.select li input + label {width: 37px;height: 37px;line-height: 35px;font-size: 13px;}

	.surveyList .item ul.select li.title {min-width: 62px;line-height: 22px;font-size: 16px;}

	.surveyList .item ul.select.label {justify-content: flex-start; flex-wrap: wrap;}
	.surveyList .item ul.select.label li {width: 50%; margin: 0 0 15px 0;}
	.surveyList .item ul.select.label li label.exp {line-height: 22px;font-size: 16px;margin-left: 8px;}

	.surveyList .item ul.radioList li {margin-right: 24px;}

	.surveyList .item .input input.inputBasic {width: 285px; max-width: 100%; font-size: 16px;}
	.surveyList .item .input input.inputBasic.small {width: 125px;}
	.surveyList .item .input input.inputBasic + span.unit {font-size: 16px;margin-left: 14px;}

	/* survey list - division */

	.surveyList.division {}
	.surveyList.division .item { flex-direction: column; justify-content: center; align-items: center; padding: 50px 0 35px;}
	.surveyList.division .item p.subject { position: relative; left: auto; top: auto; width: 100%; text-align: center;margin-bottom: 30px;margin-right: auto; transform: translateY(0);}
	.surveyList.division .item ul.select { padding: 15px 0; margin-left: 0;}
	.surveyList.division .item ul.select:last-child {margin-left: 0;}
	.surveyList.division .item ul.select li {margin-right: 15px;}

	/* survey score list */

	.surveyScoreList {margin-top: 0;}
	.surveyScoreList .item {padding: 50px 40px 0;}
	.surveyScoreList .item .head {height: 34px;}
	.surveyScoreList .item .head p.subject {line-height: 24px;font-size: 18px;}
	.surveyScoreList .item .head ul.division li {width: 40px;line-height: 18px;font-size: 14px;text-align: center;padding-top: 4px;margin-left: 5px;}

	.surveyScoreList .item ul.questionList li { padding: 24px 0; }
	.surveyScoreList .item ul.questionList li p.question {line-height: 24px;font-size: 16px; margin-right: 24px; }
	.surveyScoreList .item ul.questionList li .score p {width: 40px;margin-left: 5px;}
	.surveyScoreList .item ul.questionList li .score p:first-child { margin-left: 0; }
	.surveyScoreList .item ul.questionList li .score p input { line-height: 18px; font-size: 14px; padding: 10px 0; }

	.surveyScoreList .item .foot {height: 70px;}
	.surveyScoreList .item .foot p.title {width: auto;line-height: 22px;font-size: 14px; font-weight: 700; margin-left: 0;}
	.surveyScoreList .item .foot ul.sum { margin-left: auto; }
	.surveyScoreList .item .foot ul.sum li {width: 40px;line-height: 22px;font-size: 14px;margin-left: 5px;}

	#surveyBody .contents > .btnList {margin-top: 40px;}
	#surveyBody .contents > .btnList ul li a.btnRound {width: auto;}

	/* survey complete */

	.surveyCompleteBox {width: auto; background-position: center top 103px; background-size: 176px auto; padding: 360px 25px 150px;margin: -30px auto -90px;}
	.surveyCompleteBox p.head {line-height: 34px;font-size: 24px; text-align: center; }
	.surveyCompleteBox p.exp {line-height: 20px;font-size: 15px; text-align: center; margin-top: 18px;}

}


/* mediaquery for mobile */

@media only screen and (max-width: 680px) {

	/* survey list */

	.surveyList .item ul.select.label li label.exp {line-height: 20px;font-size: 15px;margin-left: 6px;}


	/* survey score list */

	.surveyScoreList .item ul.questionList li p.question {line-height: 20px;font-size: 14px; }
	.surveyScoreList .item {padding: 50px 25px 0;}

	.surveyList .item ul.radioList.multiline {justify-content: flex-start;}


	/* add 2022.12.15 */
	.surveyScoreList.part4 {padding: 0 25px;}
	.surveyScoreList.part4 .item {padding: 30px 0 0}
	.surveyScoreList.part4 .item.subQuestion .head.withQuestion {height: auto; align-items: center;padding-bottom:10px;}

	.surveyScoreList.part4 .item .head.withQuestion {height: auto;padding-bottom: 10px;}
	.surveyScoreList.part4 .item .head.withQuestion {flex-wrap:wrap}
	.surveyScoreList.part4 .item .head.withQuestion .subject {margin-bottom: 15px;flex: 1 1 100%}
	.surveyScoreList.part4 .item .head.withQuestion .score input.inputBasic {width: 100%;}
	.surveyScoreList.part4 .item .score {flex: 1 1 100%}
	.surveyExample p.subject.mb0 {text-align: center;}
	.surveyScoreList.part4 .item .head p.subject {font-size: 16px;}
	.surveyScoreList.part4 .item .head p.subject br {display: none;}
	.surveyScoreList.part4 .item ul.questionList li p.question {font-size: 16px; margin-bottom: 15px; flex: 1 1 100%}
	.surveyScoreList.part4 .item .head {height: auto;margin-bottom: 20px;}
	.surveyScoreList.part4 .item li {flex-wrap: wrap;}
	.surveyScoreList.part4 .item ul.questionList li .score p {width: 125px;}
	.surveyScoreList.part4 .item .score p {width: 125px;}
	.surveyScoreList.part4 .item ul.questionList li .score {margin-left: inherit; }
	/* .surveyScoreList.part4 .item.subQuestion ul.questionList li .score  {flex-direction:column;align-items: flex-start;} */
	.surveyScoreList.part4 .item.subQuestion ul.questionList li .score  {align-items: center;}
	.surveyScoreList.part4 .item.subQuestion .score > div {margin-bottom: 10px;}
	.surveyScoreList.part4 .item .score span {padding-left: 10px;}
	.surveyScoreList.part4 .item .score > div span:first-child {width: 38px; padding-left: 0}
	.surveyScoreList.part4  ul.select.label li {width: auto; min-width: 109px; border:none; flex-wrap: nowrap; white-space:nowrap; padding: 12px 0 ;}
	ul.select.label li input + label {
		width: 26px;
		height: 26px;
		line-height: 35px;
		font-size: 13px;
		border: 1px solid #ddd;
	}
	ul.select.label li label.exp {font-size: 14px;}
	
}




/* ==============================================
   unit
   ============================================== */

/* form */

input.inputBasic {line-height: 24px;font-size: 16px;border: 1px solid #dddddd;outline: none;padding: 12px 20px;}
input.inputBasic::placeholder {color: #999;}
input.inputBasic.dark {border-color: #898d94;}
input.inputBasic.small {width: 100px;}
input.inputBasic + span.unit {margin-left: 12px;}

input.selectDate {background: url('../images/common/icon_calendar.png') right 20px center no-repeat;background-size: 23px auto;}

input[type=checkbox] { display: none; }
input[type=checkbox] + label {position: relative;display: flex;align-items: center;cursor: pointer;}
input[type=checkbox] + label:before { display: block; content: " "; width: 20px; height: 20px; border: 1px solid #707070; margin-right: 10px; }
input[type=checkbox] + label:hover:before { border-color: #000; }
input[type=checkbox]:checked + label:before {font-family: "xeicon";content: "\e929";line-height: 20px;font-size: 20px; font-weight: 800;color: #62bdd6;text-align: center;}

input.radioBasic {position: relative;display:inline-block; display: -moz-inline-stack; zoom:1; *display:inline;width: 26px;height: 26px;border: 1px solid #dddddd;vertical-align: middle;margin-right: 8px;cursor: pointer;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	-moz-border-radius: 100%;
	-webkit-border-radius: 100%;
	border-radius: 100%;
	transition: all 0.2s ease;
}
input.radioBasic:hover {border-color: #bbb;}
input.radioBasic + label {display:inline-block; display: -moz-inline-stack; zoom:1; *display:inline;height: 26px;line-height: 26px;font-size: 16px;vertical-align: middle;cursor: pointer;}
input.radioBasic:after {content: " ";position: absolute;left: 5px;top: 5px;width: 14px;height: 14px;background-color: #35c0d9;
	-moz-border-radius: 100%;
	-webkit-border-radius: 100%;
	border-radius: 100%;
	transition: all 0.2s ease;
	visibility: hidden;
	opacity: 0;
}
input.radioBasic:checked:after {
     visibility: visible;
     opacity: 1;
}

input.radioBasic.large {width: 34px;height: 34px;border-color: #414853;margin-right: 10px;}
input.radioBasic.large + label {height: 34px;line-height: 34px;font-size: 18px;}
input.radioBasic.large:after {left: 7px;top: 7px;width: 18px;height: 18px;}

select.selectBasic {position: relative;display:inline-block; display: -moz-inline-stack; zoom:1; *display:inline; height: 50px; line-height: 24px; font-size: 16px; color: #252d3a; border: 1px solid #ddd; outline: none; background: url('../images/common/icon_select_arrow.png') right 20px center no-repeat; padding: 12px 50px 12px 20px;
   -webkit-appearance: none;
   -moz-appearance: none;
   appearance: none;
}
select.selectBasic::-ms-expand { display: none; }
select.selectBasic option[disabled] {display: none;}

textarea.basic {border-color: #ddd;outline: none;padding: 20px;}

ul.checkboxList {display: flex;flex-wrap: wrap;padding: 10px 0;}
ul.checkboxList li {width: 33.3%;line-height: 24px;padding: 8px 0;}

ul.radioList {display: flex;flex-wrap: wrap;}
ul.radioList li {display: flex;align-items: center;padding: 12px 0;margin-right: 30px;}
ul.radioList li:last-child {margin-right: 0;}
ul.radioList li input {margin-right: 8px;}
ul.radioList li label {line-height: 26px;font-size: 16px;}

/* input search */

.inputSearch {position: relative;display: flex;}
.inputSearch input {flex: 1 1 auto;width: 100%;}
.inputSearch button {flex: 0 0 auto;width: 120px;height: 50px;font-size: 16px;color: #6b7078;text-align: center;border: 0;outline: none;background-color: #f2f4f5;margin-left: 5px;cursor: pointer;}
.inputSearch button:hover {background-color: #ebebeb;}
.inputSearch button.black {color: #fff;font-weight: 600;background-color: #252d3a;}
.inputSearch button.black:hover {background-color: #000;}

.inputSearch ul.searchList {display: none;position: absolute;width: 100%;height: 205px;left: 0;top: 64px;border: 1px solid #898d94;background-color: #fff;overflow: hidden;overflow-y: auto;z-index: 99;}

/*
inputSearch ul.searchList::-webkit-scrollbar {width: 12px;}
.inputSearch ul.searchList::-webkit-scrollbar-thumb {width: 1px;height: 30%;background: #898d94;border-radius: 8px;}
.inputSearch ul.searchList::-webkit-scrollbar-track {width: 14px;background: transparent;}
*/

.inputSearch ul.searchList.pop {display: block;}
.inputSearch ul.searchList li {border-bottom: 1px solid #ebebeb;}
.inputSearch ul.searchList li:last-child {border-bottom: 0;}
.inputSearch ul.searchList li a {display: block;height: 50px;line-height: 50px;font-size: 16px;color: #252d3a;text-decoration: none;padding: 0 16px;}
.inputSearch ul.searchList li a:hover {background-color: #f6f6f6;}

/* input email */

.inputEmail {display: flex;align-items: center;font-size: 16px;}
.inputEmail > input.id {flex: 1 1 auto;}
.inputEmail > span {flex: 0 0 auto;display: block;width: 35px;color: #999;text-align: center;}
.inputEmail .domain {position: relative;flex: 0 0 auto;width: 245px;}
.inputEmail .domain select {width: 100%;}
.inputEmail .domain input {display: none;}
.inputEmail .domain.self select {display: none;}
.inputEmail .domain.self input {display: block;}
.inputEmail > button {flex: 0 0 auto;width: 120px;height: 50px;font-size: 16px;color: #6b7078;text-align: center;border: 0;outline: none;background-color: #f2f4f5;margin-left: 5px;cursor: pointer;}
.inputEmail > button:hover {background-color: #ebebeb;}

/* input phone */

.inputPhone {display: flex;align-items: center;font-size: 16px;}
.inputPhone > select {flex: 0 0 auto;width: 196px !important;}
.inputPhone > span {flex: 0 0 auto;display: block;width: 30px;color: #999;text-align: center;}
.inputPhone > input {flex: 1 1 auto;}

/* align */

.center { text-align: center;}
.left { text-align: left;}
.right { text-align: right;}

/* button */

a, button {
   transition: all 0.2s ease;
}

/* list */

ul.dotList {}
ul.dotList li { line-height: 22px; background: url(../images/common/icon_dot_gray.png) left 9px no-repeat; padding-left: 14px; margin-bottom: 6px; }

/* table */

table.center tr th,
table.center tr td { text-align: center;}
table.left tr th,
table.left tr td { text-align: left;}
table.right tr th,
table.right tr td { text-align: right;}
table tr.center th,
table tr.center td { text-align: center;}
table tr.left th,
table tr.left td { text-align: left;}
table tr.right th,
table tr.right td { text-align: right;}
table tr th.center,
table tr td.center { text-align: center;}
table tr th.left,
table tr td.left { text-align: left;}
table tr th.right,
table tr td.right { text-align: right;}

table.tblHorizon {width: 100%;border-top: 1px solid #e5e9eb;}
table.tblHorizon tr {}
table.tblHorizon tr td {line-height: 24px;font-size: 16px;border-bottom: 1px solid #e5e9eb;padding: 10px 0;}
table.tblHorizon tr td.title {font-size: 18px;font-weight: 700;vertical-align: middle;}

/* button */

a.btnBox, button.btnBox, input.btnBox {display:inline-block; display: -moz-inline-stack; zoom:1; *display:inline;line-height: 50px;color: #fff;font-size: 16px;font-weight: 700;text-decoration: none;text-align: center;border: 0;outline: none;background-color: #252d3a;padding: 0 40px;cursor: pointer;}
a.btnBox:hover, button.btnBox:hover, input.btnBox:hover {background-color: #3e4754;}

a.btnBox.gray, button.btnBox.gray, input.btnBox.gray {color: #6b7078;border-color: #f2f4f5;background-color: #f2f4f5;}
a.btnBox.gray:hover, button.btnBox.gray:hover, input.btnBox.gray:hover {background-color: #eaebeb;}

a.btnBox.blue, button.btnBox.blue, input.btnBox.blue {color: #fff;border-color: #35c0d9;background-color: #35c0d9;}
a.btnBox.blue:hover, button.btnBox.blue:hover, input.btnBox.blue:hover {border-color: #45cde5;background-color: #45cde5;}

a.btnRound, button.btnRound, input.btnRound {display:inline-block; display: -moz-inline-stack; zoom:1; *display:inline;line-height: 23px;font-size: 16px;color: #252d3a;font-weight: 700;text-align: center;text-decoration: none;border: 1px solid #252d3a;outline: none;cursor: pointer;padding: 16px 30px;
	-moz-border-radius: 28px;
	-webkit-border-radius: 28px;
	border-radius: 28px;
}
a.btnRound:hover, button.btnRound:hover, input.btnRound:hover {color: #6b7482;border-color: #6b7482;}
a.btnRound span, button.btnRound span, input.btnRound span {position: relative;display:inline-block; display: -moz-inline-stack; zoom:1; *display:inline;}
a.btnRound.arrow, button.btnRound.arrow, input.btnRound.arrow {padding-right: 20px;}
a.btnRound.arrow span, button.btnRound.arrow span, input.btnRound.arrow span {padding-right: 26px;}
a.btnRound.arrow span:after, button.btnRound.arrow span:after, input.btnRound.arrow span:after {content: "\e93e";position: absolute;right: 0;top: 50%;width: 24px;height: 24px;line-height: 24px;font-size: 15px;text-align: right;font-family: xeicon;margin-top: -12px;
     transition: all 0.2s ease;
}
a.btnRound.arrow:hover span:after, button.btnRound.arrow:hover span:after, input.btnRound.arrow:hover span:after {right: 6px;}

a.btnRound.blue, button.btnRound.blue, input.btnRound.blue {color: #fff;border-color: #35c0d9;background-color: #35c0d9;}
a.btnRound.blue:hover, button.btnRound.blue:hover, input.btnRound.blue:hover {border-color: #45cde5;background-color: #45cde5;}
a.btnRound.blue.arrow span:after, button.btnRound.blue.arrow span:after, input.btnRound.blue.arrow span:after {color: #fff;}

a.btnRound.gray, button.btnRound.gray, input.btnRound.gray {color: #6b7078;border-color: #f2f4f5;background-color: #f2f4f5;}
a.btnRound.gray.arrow span:after, button.btnRound.gray.arrow span:after, input.btnRound.gray.arrow span:after {color: #6b7078;}
a.btnRound.gray:hover, button.btnRound.gray:hover, input.btnRound.gray:hover {background-color: #eaebeb;}

a.btnRound.darkGray, button.btnRound.darkGray, input.btnRound.darkGray {color: #fff;border-color: #858b95;background-color: #858b95;}
a.btnRound.darkGray.arrow span:after, button.btnRound.darkGray.arrow span:after, input.btnRound.darkGray.arrow span:after {color: #fff;}
a.btnRound.darkGray:hover, button.btnRound.darkGray:hover, input.btnRound.darkGray:hover {background-color: #a1a5ac;}

a.btnRound.big, button.btnRound.big, input.btnRound.big {line-height: 30px;font-size: 20px;padding: 20px 60px;
	-moz-border-radius: 35px;
	-webkit-border-radius: 35px;
	border-radius: 35px;
}
a.btnRound.small, button.btnRound.small, input.btnRound.small {line-height: 23px;font-size: 14px;padding: 7px 30px;
	-moz-border-radius: 20px;
	-webkit-border-radius: 20px;
	border-radius: 20px;
}

a.btnRound.blueLine, button.btnRound.blueLine, input.btnRound.blueLine {color: #35c0d9;border-color: #35c0d9;}
a.btnRound.blueLine:hover, button.btnRound.blueLine:hover, input.btnRound.blueLine:hover {color: #6ae7fd;border-color: #6ae7fd;}

a.iconBtn {position: relative;display:inline-block; display: -moz-inline-stack; zoom:1; *display:inline;height: 45px;min-width: 140px;line-height: 23px;font-size: 14px;color: #252d3a;font-weight: 700;text-decoration: none;border: 1px solid #ddd;background-position: left 18px center;background-repeat: no-repeat;background-color: #fff;padding: 10px 12px 10px 52px;
	-moz-border-radius: 9px;
	-webkit-border-radius: 9px;
	border-radius: 9px;
}
a.iconBtn span {position: relative;display: block;padding-right: 15px;}
a.iconBtn span:after {content: "\e93e";position: absolute;right: 0;top: 50%;width: 24px;height: 24px;font-size: 13px;color: #aaa;text-align: right;font-family: xeicon;margin-top: -12px;
     transition: all 0.2s ease;
}
a.iconBtn:hover {border-color: #c3c3c3;}
a.iconBtn:hover span:after {right: 5px;}
a.iconBtn.pdf {background-image: url('../images/common/icon_pdf.png');background-size: 23px auto;}
a.iconBtn.youtube {background-image: url('../images/common/icon_youtube.png');background-size: 24px auto;}


/* button list */

.btnList {}
.btnList ul {display: flex;}
.btnList ul li {margin-right: 10px;}
.btnList ul li a {}
.btnList p.comment {margin-top: 20px;}

.btnList.right ul {justify-content: flex-end;}
.btnList.right ul li {margin-left:  10px;}

.btnList.center ul {justify-content: center;}
.btnList.center ul li {margin: 0 6px;}

.btnList ul li:last-child {margin-right: 0 !important;}
.btnList.right ul li:first-child {margin-left: 0 !important;}

/* tip box */

.tipBox {position: relative;display:inline-block; display: -moz-inline-stack; zoom:1; *display:inline;}
.tipBox p.tip {position: absolute;left: 50%;top: 46px;width: 200px;line-height: 24px;font-size: 16px;color: #fff;text-align: center;background-color: #35c0d9;padding: 18px 18px;margin-left: -100px;z-index: 99;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	border-radius: 4px;
	box-shadow: 0 9px 30px 0 rgba(0, 0, 0, 0.16);
	transition: all 0.3s ease;
	visibility: hidden;
	opacity: 0;
}
.tipBox p.tip.float {top: 34px;
	transition: all 0.3s ease;
	visibility: visible;
	opacity: 1;
}

/* policy box */

.scrollBox {height: 1032px;border: 1px solid #dddddd;padding: 70px;overflow: hidden;overflow-y: auto;}
.scrollBox .pre {line-height: 32px;font-size: 16px;color: #5e6064;white-space: pre-wrap;}

.policyBox .scrollBox {height: 258px;padding: 40px 45px;}
.policyBox .scrollBox .pre {line-height: 24px;font-size: 14px;color: #9b9b9b;}
.policyBox .agreement {margin-top: 20px;}

/* process */

ul.processSide {display: flex;flex-wrap: wrap;margin-bottom: -8px;}
ul.processSide li {position: relative;line-height: 20px;font-size: 16px;color: #5e6064;padding-left: 18px;margin-left: 8px;margin-bottom: 8px;}
ul.processSide li:after {content: "\e93e";display: block;position: absolute;left: 0;top: 50%;width: 10px;height: 16px;line-height: 16px;font-family: xeicon;font-size: 12px;color: #d3d5d8;text-align: left;margin-top: -8px;}
ul.processSide li:first-child {padding-left: 0;margin-left: 0;}
ul.processSide li:first-child:after {display: none;}
ul.processSide li strong {color: #35c0d9;font-weight: 700;}
ul.processSide li.return {background: url('../images/common/icon_return.png') right center no-repeat;padding-right: 25px;}

/* magazine */

.bookCon {display: flex;}
.bookCon p.text {line-height: 32px !important;font-size: 18px;color: #5e6064;}
.bookCon .bookLeft {flex: 1 1 0;margin-right: 60px;}
.bookCon .bookRight {flex: 1 1 0;}

.megazineMain {padding: 194px 0;}
.megazineMain .content {width: 1200px;margin: 0 auto;}
.megazineMain .content p.slogan {line-height: 48px;font-size: 36px;color: #252d3a;font-weight: 700;}
.megazineMain .content p.slogan strong {font-weight: 700;color: #35c0d9;}
.megazineMain .content p.name {float: right; margin: 143px 64px 0 0; font-size:20px;}
.megazineMain .content p.exp {line-height: 24px;font-size: 18px;color: #5e6064;margin-bottom: 17px;}
.megazineMain .content p.exp strong {}
.megazineMain .content p.emp {line-height: 28px;font-size: 20px;color: #000;margin-bottom: 38px;}
.megazineMain .content p.emp strong {position: relative;display:inline-block; display: -moz-inline-stack; zoom:1; *display:inline;font-weight: 700;}
.megazineMain .content p.emp strong:after {content: " ";position: absolute;bottom: 2px;left: 0;width: 100%;height: 8px;background-color: #35c0d9;opacity: 0.3;z-index: 0;}

.megazineText {padding: 80px 0 150px;}
.megazineText .content {width: 1200px;margin: 0 auto;}
.megazineText .content .btnList {margin-top: 90px;}



/* mediaquery for tablet */

@media only screen and (max-width: 1240px) {

	/* table */

	table.tblHorizon colgroup { display: none; }
	table.tblHorizon tr td.title { min-width: 120px; word-break: keep-all; padding-right: 20px; }

	/* magazine */

	.bookCon .bookLeft {margin-right: 30px;}

	.megazineMain {padding: 140px 60px;}
	.megazineMain .content {width: auto;}

	.megazineText {padding: 80px 60px 150px;}
	.megazineText .content {width: auto;}
	.megazineText .content .btnList {margin-top: 70px;}

	
	/* 진단랩 소개 */
	.megazineMain {
		position: relative;
	}
	.megazineMain .content p.name {
		font-size: 16px;
		position: absolute;
		bottom: -40px;
		left: 50%;
		transform: translate(-50%, 0);
	}
	.megazineText {
		padding: 80px 25px 90px;
	}
}


/* mediaquery for tablet mini */

@media only screen and (max-width: 940px) {

	/* form */

	input.inputBasic {line-height: 23px;font-size: 14px;padding: 10px 16px;}
	input.inputBasic.small {width: 125px;}
	input.inputBasic + span.unit {margin-left: 12px;}

	input.selectDate { background-position: right 16px center; background-size: 19px auto;}

	input[type=checkbox] + label { font-size: 14px; }
	input[type=checkbox] + label:before { margin-right: 7px; }

	input.radioBasic {position: relative;display:inline-block; display: -moz-inline-stack; zoom:1; *display:inline;width: 26px;height: 26px;border: 1px solid #dddddd;vertical-align: middle;margin-right: 8px;cursor: pointer;
		-webkit-appearance: none;
		-moz-appearance: none;
		appearance: none;
		-moz-border-radius: 100%;
		-webkit-border-radius: 100%;
		border-radius: 100%;
		transition: all 0.2s ease;
	}
	input.radioBasic:hover {border-color: #bbb;}
	input.radioBasic + label {display:inline-block; display: -moz-inline-stack; zoom:1; *display:inline;height: 26px;line-height: 26px;font-size: 16px;vertical-align: middle;cursor: pointer;}
	input.radioBasic:after {content: " ";position: absolute;left: 5px;top: 5px;width: 14px;height: 14px;background-color: #35c0d9;
		-moz-border-radius: 100%;
		-webkit-border-radius: 100%;
		border-radius: 100%;
		transition: all 0.2s ease;
		visibility: hidden;
		opacity: 0;
	}
	input.radioBasic:checked:after {
	     visibility: visible;
	     opacity: 1;
	}

	input.radioBasic.large {width: 26px;height: 26px;border-color: #bbb;margin-right: 8px;}
	input.radioBasic.large + label {height: 26px;line-height: 26px;font-size: 14px;}
	input.radioBasic.large:after {left: 5px;top: 5px;width: 14px;height: 14px;}

	select.selectBasic { height: 45px; line-height: 23px; font-size: 14px; background-position: right 16px center; padding: 10px 45px 10px 16px;}

	textarea.basic {padding: 16px;}

	ul.checkboxList {padding: 0;}
	ul.checkboxList li {width: 33.3%;line-height: 24px;padding: 8px 0;}

	ul.radioList { margin-right: -20px; }
	ul.radioList li {padding: 10px 0;margin-right: 20px;}
	ul.radioList li input {margin-right: 8px;}
	ul.radioList li label {line-height: 22px;font-size: 14px;}

	/* input search */

	.inputSearch button {width: 94px;height: 45px;font-size: 14px;}
	.inputSearch ul.searchList {height: 185px;left: 0;top: 60px;}
	.inputSearch ul.searchList li a {height: 45px;line-height: 45px;font-size: 14px;padding: 0 14px;}

	/* input email */

	.inputEmail {font-size: 14px;}
	.inputEmail .domain {width: 220px;}
	.inputEmail > button {width: 100px;height: 45px;font-size: 14px;}

	/* input phone */

	.inputPhone {font-size: 14px;}
	.inputPhone > select {width: 25% !important;}

	/* align */

	.center { text-align: center;}
	.left { text-align: left;}
	.right { text-align: right;}

	/* button */

	a, button {
	   transition: all 0.2s ease;
	}

	/* list */

	ul.dotList {}
	ul.dotList li { line-height: 22px; background: url(../images/common/icon_dot_gray.png) left 9px no-repeat; padding-left: 14px; margin-bottom: 6px; }

	/* table */

	table.tblHorizon colgroup { display: none; }
	table.tblHorizon tr {}
	table.tblHorizon tr td {line-height: 22px;font-size: 14px;padding: 8px 0;}
	table.tblHorizon tr td.title { min-width: 56px; line-height: 23px; font-size: 14px; word-break: keep-all; padding-right: 4px; }

	/* button */

	a.btnBox, button.btnBox, input.btnBox {line-height: 45px;font-size: 14px;padding: 0 30px;}

	a.btnBox.gray, button.btnBox.gray, input.btnBox.gray {color: #6b7078;border-color: #f2f4f5;background-color: #f2f4f5;}
	a.btnBox.gray:hover, button.btnBox.gray:hover, input.btnBox.gray:hover {background-color: #eaebeb;}

	a.btnRound, button.btnRound, input.btnRound {line-height: 22px;font-size: 14px;padding: 12px 25px;
		-moz-border-radius: 24px;
		-webkit-border-radius: 24px;
		border-radius: 24px;
	}
	a.btnRound.arrow, button.btnRound.arrow, input.btnRound.arrow {padding-right: 22px;}
	a.btnRound.arrow span, button.btnRound.arrow span, input.btnRound.arrow span {padding-right: 20px;}
	a.btnRound.arrow span:after, button.btnRound.arrow span:after, input.btnRound.arrow span:after {font-size: 12px;}

	a.btnRound.big, button.btnRound.big, input.btnRound.big {line-height: 26px;font-size: 16px;padding: 15px 30px;
		-moz-border-radius: 28px;
		-webkit-border-radius: 28px;
		border-radius: 28px;
	}
	a.btnRound.small, button.btnRound.small, input.btnRound.small {line-height: 20px;font-size: 12px;padding: 5px 20px;
		-moz-border-radius: 16px;
		-webkit-border-radius: 16px;
		border-radius: 16px;
	}

	a.iconBtn {position: relative;display:inline-block; display: -moz-inline-stack; zoom:1; *display:inline;height: 45px;min-width: 140px;line-height: 23px;font-size: 14px;color: #252d3a;font-weight: 700;text-decoration: none;border: 1px solid #ddd;background-position: left 18px center;background-repeat: no-repeat;background-color: #fff;padding: 10px 12px 10px 52px;
		-moz-border-radius: 9px;
		-webkit-border-radius: 9px;
		border-radius: 9px;
	}
	a.iconBtn span {position: relative;display: block;padding-right: 15px;}
	a.iconBtn span:after {content: "\e93e";position: absolute;right: 0;top: 50%;width: 24px;height: 24px;font-size: 13px;color: #aaa;text-align: right;font-family: xeicon;margin-top: -12px;
	     transition: all 0.2s ease;
	}
	a.iconBtn:hover {border-color: #c3c3c3;}
	a.iconBtn:hover span:after {right: 5px;}
	a.iconBtn.pdf {background-image: url('../images/common/icon_pdf.png');background-size: 23px auto;}
	a.iconBtn.youtube {background-image: url('../images/common/icon_youtube.png');background-size: 24px auto;}


	/* button list */

	.btnList ul li {margin-right: 5px;}
	.btnList p.comment {margin-top: 20px;}
	.btnList.right ul li {margin-left:  5px;}
	.btnList.center ul li {margin: 0 3px;}

	/* tip box */

	.tipBox p.tip {top: 40px;width: 184px;line-height: 21px;font-size: 14px;padding: 17px 17px;margin-left: -92px;z-index: 99;}
	.tipBox p.tip.float {top: 28px;}

	/* policy box */

	.scrollBox {height: 540px;padding: 20px;}
	.scrollBox .pre {line-height: 20px;font-size: 12px;color: #a1a1a1;}

	.policyBox .scrollBox {height: 200px;padding: 20px;}
	.policyBox .scrollBox .pre {line-height: 20px;font-size: 12px;color: #9b9b9b;}
	.policyBox .agreement {margin-top: 15px;}

	/* magazine */

	.bookCon { flex-direction: column; }
	.bookCon p.text {line-height: 24px !important;font-size: 15px;}
	.bookCon .bookLeft {margin-right: 0; margin-bottom: 24px; }
	.bookCon .bookRight {}

	.megazineMain {padding: 50px 60px calc((100vw * 220/375) + 38px);}
	.megazineMain .content {width: auto; word-break: keep-all; }
	.megazineMain .content p.slogan {line-height: 34px;font-size: 24px; }
	.megazineMain .content p.slogan br { display: none; }
	.megazineMain .content p.name {float: right; margin-top: 250px; font-size: 10px;}
	.megazineMain .content p.exp {line-height: 20px;font-size: 15px;}
	.megazineMain .content p.emp {line-height: 26px;font-size: 18px;margin-bottom: 28px;}

	/* .megazineText {padding: 40px 60px 90px;} */
	.megazineText .content {width: auto;}
	.megazineText .content .btnList {margin-top: 40px;}

	

}


/* mediaquery for mobile */

@media only screen and (max-width: 680px) {

	/* form */

	ul.checkboxList li {width: 50%;}

	/* input email */

	.inputEmail { flex-wrap: wrap; font-size: 14px;}
	.inputEmail > input.id { width: 100%; margin-bottom: 10px; }
	.inputEmail > span { display: none; }
	.inputEmail .domain {flex: 1 1 auto;width: calc(100% - 105px);}
	.inputEmail .domain select {width: 100%;}

	/* input phone */

	.inputPhone > select {width: 30% !important;}
	.inputPhone > span {width: 15px;}

	/* magazine */
/* 
	.megazineMain {padding: 50px 25px calc((100vw * 220/375) + 38px);}
	.megazineText {padding: 40px 25px 90px;} */

}




/* ==============================================
   popup : layer
   ============================================== */

/* laytout */

.layerpopWrap {display: none;
   align-items: center;/* Center vertically */
   justify-content: center;/*Center horizontaly */
   -ms-flex-pack: center;/*Center horizontaly ie */
   position: fixed;left: 0;top: 0;width: 100%;height: 100%;background-color: rgba(0,0,0,.2);z-index: 9999; }
.layerpopWrap.active {
  	display: -ms-flexbox;
   	display: -webkit-flex;
   	display: flex;
	position: fixed;
}
.layerpopWrap .layerpopCon {position: relative;width: 555px;max-width: 100%;border: 1px solid #898d94;background-color: #fff;}
.layerpopWrap .layerpopCon a.btnClose {position: absolute;right: 30px;top: 30px;height: 20px;line-height: 20px;font-size: 16px;color: #252d3a;text-decoration: none;padding-left: 23px;}
.layerpopWrap .layerpopCon a.btnClose:after {content: "\e921";display: block;position: absolute;left: 0;top: 50%;width: 20;height: 20;line-height: 20px;font-family:xeicon;color: #fff;font-size: 17px;color: #252d3a;text-align: left;margin-top: -10px;}

.layerpopWrap .layerpopCon p.head {line-height: 26px;font-size: 20px;font-weight: 700;}
.layerpopWrap .layerpopCon p.exp {line-height: 26px;font-size: 16px;color: #999;}

.layerpopWrap .layerpopCon .contents {padding: 70px 60px 50px;}
.layerpopWrap .layerpopCon .contents.center {text-align: center;}
.layerpopWrap .layerpopCon .contents p.exp {margin-top: 14px;}
.layerpopWrap .layerpopCon .contents .btnList {margin-top: 48px;}

.layerpopWrap.alert .layerpopCon .contents {padding: 95px 60px 70px;}

.layerpopWrap .layerpopCon .contentsTop {padding: 68px 60px 80px;}
.layerpopWrap .layerpopCon .contentsTop p.head {margin-bottom: 28px;}
.layerpopWrap .layerpopCon .contentsBottom {border-top: 1px solid #c4c6c9;padding: 48px 60px 50px;}
.layerpopWrap .layerpopCon .contentsBottom p.exp {margin-bottom: 17px;}

.layerpopWrap .layerpopCon .btnList.center ul li {margin: 0 3px;}
.layerpopWrap .layerpopCon .btnList.center ul li a.btnBox {min-width: 150px;}



/* mediaquery for tablet */

@media only screen and (max-width: 1240px) {

}


/* mediaquery for tablet mini */

@media only screen and (max-width: 940px) {

}


/* mediaquery for mobile */

@media only screen and (max-width: 680px) {

	/* laytout */

	.layerpopWrap {
	}
	.layerpopWrap .layerpopCon {width: 100%; border: 0;}
	.layerpopWrap .layerpopCon a.btnClose {right: 25px;top: 25px;font-size: 15px;}

	.layerpopWrap .layerpopCon p.head {line-height: 22px;font-size: 18px;}
	.layerpopWrap .layerpopCon p.exp {line-height: 22px;font-size: 14px;}

	.layerpopWrap .layerpopCon .contents {padding: 70px 25px 50px;}
	.layerpopWrap .layerpopCon .contents p.exp {margin-top: 20px;}
	.layerpopWrap .layerpopCon .contents .btnList {margin-top: 30px;}

	.layerpopWrap.alert .layerpopCon .contents {padding: 80px 25px 54px;}

	.layerpopWrap .layerpopCon .contentsTop {padding: 70px 25px 50px;}
	.layerpopWrap .layerpopCon .contentsTop p.head { font-size: 16px; margin-bottom: 20px;}
	.layerpopWrap .layerpopCon .contentsBottom {padding: 48px 25px 50px;}
	.layerpopWrap .layerpopCon .contentsBottom p.exp {margin-bottom: 17px;}

	.layerpopWrap .layerpopCon .btnList.center ul li {margin: 0 3px;}
	.layerpopWrap .layerpopCon .btnList.center ul li a.btnBox {min-width: 120px;}

}




/* ==============================================
   introduce
   ============================================== */

/* jindanlab */

#introJindanlab .megazineMain {
	background-color: #f1f1f1;
	/*url('../images/introduce/jindanlab_top_img@2x.jpg') center top no-repeat;background-size: cover;*/}

/* jindan service */

#introJindanService {}
#introJindanService .conUnit.effect p.topSlogan {margin-bottom: 30px;}

#introJindanService .conUnit.effect .diagram {}
#introJindanService .conUnit.effect .diagram p.head {line-height: 30px;font-size: 24px;text-align: center;margin-bottom: 60px;}
#introJindanService .conUnit.effect .diagram ul {position: relative;display: flex;justify-content: center;height: 596px;padding: 149px 0;}
#introJindanService .conUnit.effect .diagram ul li {position: relative;width: 298px;height: 298px;text-align: center;padding-top: 105px;
	-moz-border-radius: 100%;
	-webkit-border-radius: 100%;
	border-radius: 100%;
}
#introJindanService .conUnit.effect .diagram ul li p.title {position: relative;line-height: 48px;font-size: 33px;color: #fff;font-weight: 700;z-index: 3;}
#introJindanService .conUnit.effect .diagram ul li p.exp {position: relative;line-height: 25px;font-size: 20px;color: #fff;margin-top: 12px;z-index: 3;}
#introJindanService .conUnit.effect .diagram ul li.social {position: absolute;left: 50%;top: 0;background-color: rgba(53,192,217,.6);padding-top: 75px;transform: translateX(-50%);}
#introJindanService .conUnit.effect .diagram ul li.environment {background-color: rgba(42,160,217,.6);}
#introJindanService .conUnit.effect .diagram ul li.performance {background-color: rgba(29,190,195,.6);}
#introJindanService .conUnit.effect .diagram ul li.human {position: absolute;left: 50%;bottom: 0;background-color: rgba(92,206,158,.6);padding-top: 112px;transform: translateX(-50%);}

#introJindanService .conUnit.process .diagram {height: 310px;background: url('../images/introduce/jindan_service_process.png') center top no-repeat;}
#introJindanService .conUnit.process .diagram ul {display: none;}

#introJindanService .conUnit .btnList {margin-top: 80px;}

#introJindanService .conUnit.ability {border-top: 1px solid #e5e9eb;overflow: hidden;}
#introJindanService .conUnit.ability .content {width: 1200px;margin: 0 auto;}
#introJindanService .conUnit.ability .content:after {content: " ";position: absolute;right: -140px;top: 30px;width: 400px;height: 320px;background: url('../images/introduce/jindan_service_icon_ability.png') left top no-repeat;}

#introJindanService .conUnit.human {border-top: 1px solid #e5e9eb;overflow: hidden;}
#introJindanService .conUnit.human .content {width: 1200px;margin: 0 auto;}
#introJindanService .conUnit.human .content:after {content: " ";position: absolute;right: -140px;top: 30px;width: 400px;height: 320px;background: url('../images/introduce/jindan_service_icon_human.png') left top no-repeat;}

#introJindanService .conUnit.culture {border-top: 1px solid #e5e9eb;overflow: hidden;}
#introJindanService .conUnit.culture .content {width: 1200px;margin: 0 auto;}
#introJindanService .conUnit.culture .content:after {content: " ";position: absolute;right: -140px;top: 30px;width: 400px;height: 320px;background: url('../images/introduce/jindan_service_icon_culture.png') left top no-repeat;}



/* mediaquery for tablet */

@media only screen and (max-width: 1240px) {

	#introJindanService .conUnit.process .diagram {height: calc((100vw -  120px) * 176/626); background-size: 100% auto; }

	#introJindanService .conUnit.ability .content {width: auto;}
	#introJindanService .conUnit.ability .content:after {right: -120px;top: 30px;width: 340px;height: calc(340px * 32/40);background-size: 100% auto;}
	#introJindanService .conUnit.human .content {width: auto;}
	#introJindanService .conUnit.human .content:after {right: -120px;top: 30px;width: 340px;height: calc(340px * 32/40);background-size: 100% auto;}
	#introJindanService .conUnit.culture .content {width: auto;}
	#introJindanService .conUnit.culture .content:after {right: -120px;top: 30px;width: 340px;height: calc(340px * 32/40);background-size: 100% auto;}

}


/* mediaquery for tablet mini */

@media only screen and (max-width: 940px) {

	/* jindanlab */

	/* #introJindanlab .megazineMain {background: url('../images/introduce/jindanlab_top_img_mobile@2x.jpg') center bottom no-repeat;background-size: 100% auto;} */

	/* jindan service */



	#introJindanService .conUnit p.comment { width: 50%; margin: 20px auto 0; }

	#introJindanService .conUnit.effect { padding-bottom: 0; }
	#introJindanService .conUnit.effect p.topSlogan {margin-bottom: 30px; background-color: #f1f1f1;}

	#introJindanService .conUnit.effect .diagram {}
	#introJindanService .conUnit.effect .diagram p.head {line-height: 28px;font-size: 20px;margin-bottom: 30px;}
	#introJindanService .conUnit.effect .diagram ul {height: 544px;padding: 136px 0;}
	#introJindanService .conUnit.effect .diagram ul li {width: 272px;height: 272px;padding-top: 93px;}
	#introJindanService .conUnit.effect .diagram ul li p.title {line-height: 38px;font-size: 28px;}
	#introJindanService .conUnit.effect .diagram ul li p.exp { width: 162px; line-height: 24px;font-size: 18px;margin: 12px auto 0;}
	#introJindanService .conUnit.effect .diagram ul li.social {padding-top: 65px;}
	#introJindanService .conUnit.effect .diagram ul li.human {padding-top: 87px;}


	#introJindanService .conUnit .btnList {margin-top: 60px;}

	#introJindanService .conUnit.ability { padding: 60px 60px; }
	#introJindanService .conUnit.ability .content {width: auto;}
	#introJindanService .conUnit.ability .content:after {right: -60px;top: 20px;width: 290px;height: 232px; background-size: 100% auto; }
	#introJindanService .conUnit.ability .content p.text { width: 50%; }

	#introJindanService .conUnit.human { padding: 60px 60px; }
	#introJindanService .conUnit.human .content {width: auto;}
	#introJindanService .conUnit.human .content:after {right: -60px;top: 20px;width: 290px;height: 232px; background-size: 100% auto; }
	#introJindanService .conUnit.human .content p.text { width: 50%; }

	#introJindanService .conUnit.culture { padding: 60px 60px; }
	#introJindanService .conUnit.culture .content {width: auto;}
	#introJindanService .conUnit.culture .content:after {right: -60px;top: 20px;width: 290px;height: 232px; background-size: 100% auto; }
	#introJindanService .conUnit.culture .content p.text { width: 50%; }

}


/* mediaquery for mobile */

@media only screen and (max-width: 680px) {

	/* jindan service */

	#introJindanService .conUnit p.comment { width: auto; text-align: left; }

	#introJindanService .conUnit.effect { padding-bottom: 30px; }
	#introJindanService .conUnit.effect p.topSlogan {margin-bottom: 30px;}

	#introJindanService .conUnit.effect .diagram {}
	#introJindanService .conUnit.effect .diagram p.head { width: 220px; margin: 0 auto 30px; }
	#introJindanService .conUnit.effect .diagram ul {height: calc(100vw - 40px);padding: calc((100vw - 40px) * 1/4) 0;}
	#introJindanService .conUnit.effect .diagram ul li { display: flex; flex-direction: column; justify-content: center; align-items: center; width: calc((100vw - 40px) * 1/2);height: calc((100vw - 40px) * 1/2);padding-top: 0 !important;}
	#introJindanService .conUnit.effect .diagram ul li p.title {line-height: 28px;font-size: 22px;}
	#introJindanService .conUnit.effect .diagram ul li p.exp { width: 110px; line-height: 16px;font-size: 13px;margin: 7px auto 0;}

	#introJindanService .conUnit.process .diagram { width: 335px; height: 372px; background-image: url('../images/introduce/jindan_service_process_mobile.png'); margin: 0 auto; }

	#introJindanService .conUnit .btnList {margin-top: 40px;}
	#introJindanService .conUnit .btnList ul { flex-direction: column; align-items: flex-start; margin-bottom: -10px; }
	#introJindanService .conUnit .btnList ul li { margin: 0 0 10px 0; }

	#introJindanService .conUnit.ability { padding: 0 25px 50px; }
	#introJindanService .conUnit.ability .content { padding-top: 292px; }
	#introJindanService .conUnit.ability .content:after { left: 50%; right: auto; top: 40px; margin-left: -103px; }
	#introJindanService .conUnit.ability .content p.text { width: auto; }

	#introJindanService .conUnit.human { padding: 0 25px 50px; }
	#introJindanService .conUnit.human .content { padding-top: 292px; }
	#introJindanService .conUnit.human .content:after { left: 50%; right: auto; top: 40px; margin-left: -103px; }
	#introJindanService .conUnit.human .content p.text { width: auto; }

	#introJindanService .conUnit.culture { padding: 0 25px 50px; }
	#introJindanService .conUnit.culture .content { padding-top: 292px; }
	#introJindanService .conUnit.culture .content:after { left: 50%; right: auto; top: 40px; margin-left: -103px; }
	#introJindanService .conUnit.culture .content p.text { width: auto; }

}




/* ==============================================
   survey
   ============================================== */

/* make survey */

.makeSurvey {background-color: #f0f8fa;padding: 110px 0 120px;}
.makeSurvey .topExp {width: 1200px;margin: 0 auto 100px;}
.makeSurvey .topExp p.main {line-height: 40px;font-size: 30px;text-align: center;}
.makeSurvey .topExp p.main strong {color: #35c0d9;font-weight: 700;}

.makeSurvey .makeBox {width: 1200px;background-color: #fff;padding: 60px;margin: 0 auto;}
.makeSurvey .makeBox .content {}
.makeSurvey .makeBox .content.makeLink {padding: 50px 0 25px;}
.makeSurvey .makeBox .content.copyLink {padding: 30px 0 30px;}
.makeSurvey .makeBox .content ul.period {}
.makeSurvey .makeBox .content ul.period li {display: flex;justify-content: center;align-items: center;}
.makeSurvey .makeBox .content ul.period li.start {margin-bottom: 10px;}
.makeSurvey .makeBox .content ul.period li.end {margin-bottom: 10px;}
.makeSurvey .makeBox .content ul.period li.s-info {} /* add ethan */

.makeSurvey .makeBox .content ul.period li p.title {width: 75px;line-height: 26px;font-size: 16px;font-weight: 700;}
.makeSurvey .makeBox .content ul.period li p.date {width: 460px;}
.makeSurvey .makeBox .content ul.period li p.hour {width: 150px;margin-left: 5px;}
.makeSurvey .makeBox .content ul.period li p.minute {width: 150px;margin-left: 5px;}

.makeSurvey .makeBox .content ul.period li p.s-title {width: 75px;line-height: 26px;font-size: 16px;font-weight: 700;} /* add ethan */
.makeSurvey .makeBox .content ul.period li p.s-input {width: 460px;}
.makeSurvey .makeBox .content ul.period li p.part-title {text-align: right; width: 150px; line-height: 26px;font-size: 16px;font-weight: 700; padding-right: 20px;} /* add ethan */
.makeSurvey .makeBox .content ul.period li p.part-num {width: 150px;margin-left: 5px;} /* add ethan */

.makeSurvey .makeBox .content ul.period li input,
.makeSurvey .makeBox .content ul.period li select {width: 100%;}
.makeSurvey .makeBox .content.makeLink .btnList {margin-top: 55px;}
.makeSurvey .makeBox .content.makeLink .btnList ul li a.btnRound {width: 370px;}



.makeSurvey .makeBox .content ul.link {}
.makeSurvey .makeBox .content ul.link li {display: flex;justify-content: center;align-items: center;}
.makeSurvey .makeBox .content ul.link li p.title {width: 75px;line-height: 26px;font-size: 16px;font-weight: 700;}
.makeSurvey .makeBox .content ul.link li p.address {width: 600px;}
.makeSurvey .makeBox .content ul.link li input {width: 100%;color: #35c0d9;text-decoration: underline;text-align: center;}
.makeSurvey .makeBox .content.copyLink .btnList {margin-top: 30px;}
.makeSurvey .makeBox .content.copyLink .btnList ul li a.btnRound {width: 153px;}

.makeSurvey .makeBox .content p.notify {line-height: 22px;font-size: 16px;color: #727478;text-align: center;margin-top: 47px;}

.makeSurvey .addBox {width: 1200px;background-color: #fff;padding: 60px;margin: 10px auto 0;}
.makeSurvey .addBox .content {display: flex;align-items: center;}
.makeSurvey .addBox .content .title {}
.makeSurvey .addBox .content .title p.main {line-height: 32px;font-size: 24px;font-weight: 700;}
.makeSurvey .addBox .content .title p.exp {line-height: 22px;font-size: 16px;color: #5e6064;margin-top: 10px;}
.makeSurvey .addBox .content ul.link {display: flex;margin-left: auto;}
.makeSurvey .addBox .content ul.link li {margin-left: 5px;}
.makeSurvey .addBox .content ul.link li:first-child {margin-left: 0;}
.makeSurvey .addBox .content ul.link li a.iconBtn {}

.surveyPersonal {padding-top: 30px;}

/* 참여인원 */
.makeSurvey .makeBox .content ul.period li.part-num {margin-top: 10px;}




/* mediaquery for tablet */

@media only screen and (max-width: 1240px) {

	/* make survey */

	.makeSurvey .topExp {width: auto;}
	.makeSurvey .topExp p.main {line-height: 36px;font-size: 26px;}

	.makeSurvey .makeBox {width: auto;padding: 40px;margin: 0 60px;}

	.makeSurvey .addBox {width: auto;padding: 60px 40px;margin: 10px 60px 0;}

	.surveyPersonal {padding: 30px 60px 0;}

}


/* mediaquery for tablet mini */

@media only screen and (max-width: 940px) {

	/* make survey */

	.makeSurvey {padding: 50px 0 50px;}
	.makeSurvey .topExp {width: auto;margin: 0 auto 50px;}
	.makeSurvey .topExp p.main { line-height: 26px;font-size: 20px; word-break: keep-all; }

	.makeSurvey .makeBox {width: auto;padding: 40px 60px; margin: 0 auto; }
	.makeSurvey .makeBox .content.makeLink {padding: 0;}
	.makeSurvey .makeBox .content.copyLink {padding: 0;}
	.makeSurvey .makeBox .content ul.period li { flex-wrap: wrap; }
	.makeSurvey .makeBox .content ul.period li.start {margin-bottom: 20px;}
	.makeSurvey .makeBox .content ul.period li p.title {width: 100%;line-height: 22px;font-size: 14px; margin-bottom: 8px; }
	.makeSurvey .makeBox .content ul.period li p.date {width: 100%; margin-bottom: 10px; }
	.makeSurvey .makeBox .content ul.period li p.hour { flex: 1 1 auto; width: auto;margin-left: 0;}
	.makeSurvey .makeBox .content ul.period li p.minute { flex: 1 1 auto; width: auto;margin-left: 5px;}
	.makeSurvey .makeBox .content ul.period li input,
	.makeSurvey .makeBox .content ul.period li select {width: 100%;}
	.makeSurvey .makeBox .content.makeLink .btnList {margin-top: 30px;}
	.makeSurvey .makeBox .content.makeLink .btnList ul li {width: 100%;}
	.makeSurvey .makeBox .content.makeLink .btnList ul li a.btnRound {width: 100%;}

	.makeSurvey .makeBox .content ul.link li { flex-wrap: wrap; }
	.makeSurvey .makeBox .content ul.link li p.title {width: 100%;line-height: 22px;font-size: 14px; margin-bottom: 8px; }
	.makeSurvey .makeBox .content ul.link li p.address {width: 100%;}
	.makeSurvey .makeBox .content.copyLink .btnList {margin-top: 30px;}
	.makeSurvey .makeBox .content.copyLink .btnList ul li a.btnRound {width: 100%;}

	.makeSurvey .makeBox .content p.notify {line-height: 20px;font-size: 14px;margin-top: 24px;}

	.makeSurvey .addBox {width: auto;padding: 40px 60px;margin: 10px auto 0;}
	.makeSurvey .addBox .content { flex-direction: column; align-items: flex-start; }
	.makeSurvey .addBox .content .title { margin-bottom: 36px; }
	.makeSurvey .addBox .content .title p.main {line-height: 26px;font-size: 18px;}
	.makeSurvey .addBox .content .title p.exp {line-height: 20px;font-size: 14px;margin-top: 8px;}
	.makeSurvey .addBox .content ul.link {margin-left: 0;}

	.surveyPersonal {padding: 20px 40px 0;}

}


/* mediaquery for mobile */

@media only screen and (max-width: 680px) {

	/* make survey */

	.makeSurvey .topExp p.main { width: 300px; margin: 0 auto; }
	.makeSurvey .topExp p.main br { display: none; }

	.makeSurvey .makeBox {padding: 40px 25px;}

	.makeSurvey .addBox {padding: 40px 25px;}
	.makeSurvey .addBox .content .title p.exp { width: 250px; }

	.surveyPersonal {padding: 20px 25px 0;}

}




/* ==============================================
   community
   ============================================== */

/* inquiry */

.inquiryWrap {width: 820px;margin: 90px auto 150px;}
.inquiryWrap .btnList {margin-top: 50px;}
.inquiryWrap .btnList ul li a.btnRound {width: 430px;}



/* mediaquery for tablet */

@media only screen and (max-width: 1240px) {

}


/* mediaquery for tablet mini */

@media only screen and (max-width: 940px) {

	/* inquiry */

	.inquiryWrap {width: auto;margin: 40px 60px 50px;}
	.inquiryWrap .btnList {margin-top: 30px;}
	.inquiryWrap .btnList ul li {width: 100%;}
	.inquiryWrap .btnList ul li a.btnRound {width: 100%;}

}


/* mediaquery for mobile */

@media only screen and (max-width: 680px) {

	/* inquiry */

	.inquiryWrap {margin: 40px 25px 50px;}

}

/* ==============================================
   진단랩 자문단/멤버십소개
   ============================================== */
#introJindanPanel ul.panel {
	display: block;
	overflow: auto;
	width: 1200px;
	margin: 80px auto 70px;
	font-size: 22px;
	color: #252d3a;
}
#introJindanPanel ul.panel li {
	float: left;
	width: calc(50% - 20px);
	height: 260px;
	border-radius: 16px;
	background-color: #f2f4f5;
	padding: 55px 0 55px 230px;
	margin-left: 40px;
	background-position: left 50px bottom 55px; 
	background-repeat: no-repeat;
	background-size: 150px;
	margin-bottom: 30px;
}
#introJindanPanel ul.panel li:nth-child(2n-1) {
	margin-left: 0;
}
#introJindanPanel ul.panel li:nth-child(1) {
	background-image: url(../images/introduce/panel_1.png)
}
#introJindanPanel ul.panel li:nth-child(2) {
	background-image: url(../images/introduce/panel_2.png)
}
#introJindanPanel ul.panel li:nth-child(3) {
	background-image: url(../images/introduce/panel_3.png)
}
#introJindanPanel ul.panel li:nth-child(4) {
	background-image: url(../images/introduce/panel_4.png)
}
#introJindanPanel ul.panel li:nth-child(5) {
	background-image: url(../images/introduce/panel_5.png)
}
#introJindanPanel ul.panel .name {
	font-weight: 700;
	margin-bottom: 5px;
}
#introJindanPanel ul.panel .part {
	font-size: 16px;
	line-height: 26px;
	margin-top: 15px;
}
#introJindanPanel ul.panel a {
	margin-top: 29px;
	display: inline-block;
	font-size: 16px;
	font-weight: 700;
	text-decoration: none;
	color: #252d3a;
	border-bottom: 1px solid #252d3a;
	line-height: 34px;
}
#introJindanPanel .content .topSlogan {
	width: 1200px;
	margin: 0 auto;
	word-break: keep-all;
}
ul.membership {
	display: block;
	overflow: auto;
	width: 1200px;
	margin: 100px auto 70px;
	font-size: 18px;
	color: #252d3a;
	text-align: center;
	border-bottom: 1px solid #e5e9eb;
}
ul.membership > li {
	float: left;
	height: 497px;
	/* width: calc(33.3% - 60px); */
	width: calc(33% - 60px);
	background-color: #f7f8fa;
	margin-left: 60px;
	margin-bottom: 60px;
	border-radius: 16px;
}
ul.membership > li:last-child {
	margin-bottom: 79.5px;
}
ul.membership > li:nth-child(3n-2) {
	margin-left: 0;
}
ul.membership > li .top {
	background-color: #c3ecf4;
	height: 139px;
	text-align: center;
	color: #252d3a;
	padding: 19px 0;
	font-size: 21px;
	font-weight: 700;
	border-top-left-radius: 16px;
	border-top-right-radius: 16px;
}
ul.membership > li:nth-child(2) .top {
	background-color: #78d5e6;
}
ul.membership > li:nth-child(3) .top {
	background-color: #86c6e8;
}
ul.membership > li:nth-child(4) .top {
	background-color: #92debe;
}
ul.membership > li:nth-child(5) .top {
	background-color: #77d8c9;
}
ul.membership > li:nth-child(6) .top {
	background-color: #e0bc46;
}
ul.membership > li .top .grade {
	font-size: 62px;	
}
ul.membership > li .body {
	height: 193px;
	border-bottom: 1px solid rgba(112, 112, 112, .1);
}
ul.membership > li ul.service {
	text-align: center;
    padding: 40px 0 0 0;
    overflow: auto;
	display: inline-block;
}
ul.membership > li ul.service li {
	line-height: 31px;
}
ul.membership > li .bottom {
	text-align: center;
	font-size: 20px;
	padding: 39px 0 0 0;
}
ul.membership > li .bottom .times {
	font-size: 24px;
	font-weight: 700;
	/* line-height: 41px; */
}
ul.membership > li .bottom .price strong {
	font-size: 37px;
	font-weight: 700;
	line-height: 63px;
}
.mb0 {
	margin-bottom: 0!important;
}
#introMembership .advice {
	width: 1200px;
	height: 293px;
	margin: 0 auto;
	border: 1px solid #707070;
	border-radius: 16px;
	padding: 69px 30px 68px;
	text-align: center;
}
#introMembership .advice h4 {
	margin-bottom: 23px;
}
#introMembership .advice p {
	font-size: 18px;
	line-height: 26px;
	margin-bottom: 23px;
}
#introMembership .advice p span {
	font-weight: bold;
	background: linear-gradient(to top, rgba(53, 192, 217, 0.3) 50%, transparent 50%);
}
@media only screen and (max-width: 1240px) {
	#introJindanPanel .content .topSlogan {
		width: auto;
	}
	#introJindanPanel ul.panel {
		width: auto;
	}
	#introJindanPanel ul.panel li {
		margin-left: 0;
		width: 100%;
		padding: 55px 0 55px 280px;
	}
	ul.membership {
		width: auto;
	}
	ul.membership > li {
		width: calc(50% - 30px);
	}
	ul.membership > li:nth-child(n) {
		margin-left: 60px;
	}
	ul.membership > li:nth-child(2n-1) {
		margin-left: 0;
	}
	#introMembership .advice {
		width: auto;
		height: auto;
	}
}

@media only screen and (max-width: 940px) {
	#introJindanPanel .content .topSlogan {
		width: auto;
	}
	#introJindanPanel ul.panel {
		width: auto;
	}
	#introJindanPanel ul.panel li {
		margin-left: 0;
		width: 100%;
	}
}

@media only screen and (max-width: 680px) {
	#introJindanPanel ul.panel {
		margin: 80px -25px 0;
		font-size: 16px;
	}
	#introJindanPanel ul.panel li {
		border-radius: 0;
		margin-bottom: 10px;
		height: 197px;
		background-position: left 25px top 35px; 
		background-size: 85px;
		padding: 43px 0 0 130px;
	}
	#introJindanPanel ul.panel .name {
		font-weight: 700;
		margin-bottom: 5px;
	}
	#introJindanPanel ul.panel .part {
		font-size: 14px;
		line-height: 22px;
		margin-top: 11px;
	}
	#introJindanPanel ul.panel a {
		margin-top: 22px;
		font-size: 15px;
		line-height: 24px;
	}
	ul.membership {
		overflow: hidden;
		font-size: 16px;
		border-bottom: none;
		margin: 68px auto 20px;
	}
	ul.membership > li {
		width: 100%;
		height: 339px;
		margin-bottom: 20px;
	}
	ul.membership > li:last-child {
		margin-bottom: 1px;
	}
	ul.membership > li:nth-child(n) {
		margin-left: 0;
	}
	ul.membership > li .top {
		height: 90px;
		padding: 14px;
	}
	ul.membership > li .top .grade {
		font-size: 51px;
	}
	ul.membership > li .top .txt {
		display: none;
	}
	ul.membership > li .body {
		height: 112.5px;
	}
	ul.membership > li ul.service li {
		float: left;
	}
	ul.membership > li ul.service li::after {
		content: " / ";
	}
	ul.membership > li ul.service li:nth-last-child(-n+1)::after {
		content: "";
	}
	
	ul.membership > li ul.service li.strong {
		display: block;
	}
	ul.membership > li .bottom {
		font-size: 17px;
		padding: 34.5px 0 35px 0;
	}
	ul.membership > li .bottom .times {
		font-size: 20px;
	}
	ul.membership > li .bottom .price strong {
		font-size: 32px;
		line-height: 55px;
	}
	#introMembership .advice {
		padding: 69px 30px 43px
	}
	#introMembership .advice p br {
		display: none;
	}
}

/* FAQ */

/*#identityFaq .faqUnit {width: 430px;margin: 150px auto;}*/
/*#identityFaq .faqUnit p.head {text-align: center;}*/


.faqUnit p.head {line-height: 26px;font-size: 20px;font-weight: 700;margin-bottom: 50px;}
.faq-table-title {background-color: #f9f9f9; font-weight: 800;}
.grid-cell {
	border: 1px solid #ccc;
	padding: 20px;
	text-align: center;
	/*background-color: #f9f9f9;*/
}
.faq-font{color: #00BCD4 !important;  font-weight: 600}
.comma {text-align:center;}

/* survey score list */

.survey_add_question {margin-top: 10px;}
.survey_add_question .item {}
.survey_add_question .item .head {margin-bottom: 10px;}
.survey_add_question .item .head p.subject {font-size: 1.3rem;font-weight: 700;}

.survey_add_question {margin-top: 10px;}
.survey_add_question .item {padding-top: 60px;}
.survey_add_question .item .question {display: block}
.survey_add_question .item .question .textAddtional {width:100%;  padding:20px;}

.survey_add_question {border-top: 1px solid #e5e9eb;}
.survey_add_question .item .question {position: relative;border-bottom: 1px solid #e5e9eb;}
.survey_add_question .item .question p.subject {line-height: 30px;font-size: 1.2rem;font-weight: 700;text-align: center;margin-bottom: 32px;}
.survey_add_question .item .question ul.select {/*display: flex;*/ margin-bottom: 10px;}
.survey_add_question .item .question ul.select ul {height: 46px;}
.survey_add_question .item .question ul.select li {position: relative;     display: flex;    align-items: center;}
.survey_add_question .item .question ul.select li:last-child {margin-right: 0;}


.survey_add_question .item .question ul.select li input {display: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}
.survey_add_question .item .question ul.select li input + label {display: block;width: 46px;height: 46px;line-height: 44px;font-size: 18px;color: #252d3a;text-align: center;border: 1px solid #252d3a;cursor: pointer;
	-moz-border-radius: 100%;
	-webkit-border-radius: 100%;
	border-radius: 100%;
	transition: all 0.2s ease;
}
.survey_add_question .item .question ul.select li input + label:hover {color: #35c0d9;border-color: #35c0d9;}
.survey_add_question .item .question ul.select li input:checked + label {color: #fff;
	font-weight: 700;
	border-color: #35c0d9;
	background-color: #35c0d9;}

.survey_add_question .item .question ul.select li.title {display: none;min-width: 100px;line-height: 30px;font-size: 20px;font-weight: 700;}

.survey_add_question .item .question ul.select.label li {display: flex;align-items: center;margin-right: 40px;}
.survey_add_question .item .question ul.select.label li input + label {flex: 0 0 auto;}
.survey_add_question .item .question ul.select.label li label.exp {line-height: 24px;font-size: 18px;margin-left: 8px;cursor: pointer;}

.survey_add_question .item .question ul.radioList {justify-content: center;align-items: center;}
.survey_add_question .item .question ul.radioList li {margin-right: 35px;}

.survey_add_question .item .question .input {display: flex;justify-content: center;align-items: center;}
.survey_add_question .item .question .input input.inputBasic {width: 405px;font-size: 18px;}
.survey_add_question .item .question .input input.inputBasic.small {width: 125px;}
.survey_add_question .item .question .input input.inputBasic + span.unit {font-size: 18px;margin-left: 18px;}

/*.survey_add_question .item .question ul.select li.leaf {line-height: 34px;font-size: 26px;font-weight: 500;}*/