@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap');
@import url(./reset.css);
@import url(./common_color.css);
@import url(../lib/color_table/color.css);


/* common */
body {font-family:'Noto Sans KR', sans-serif}
.wrap {max-width:1200px;padding:0 40px;margin:0 auto}
.section {margin:50px auto}
.inbox {padding:30px 20px}
.inbox--left {padding-left:30px}
.main-title {font-size:50px;margin:50px 0;border-bottom:1px solid #000}
.title::before {content:'*';display:inline-block;}
.title {padding:20px 0;font-size:40px}
.sub-title {padding:10px 0;font-size:30px;border-bottom:2px solid #aaa}
.sub-title::before {content:':';display:inline-block}
/* 제목 */
.title-box {margin:20px 0}
.text-box {margin:20px 0}
.weight-box {margin:20px 0;font-size:30px}
.title_h2 {font-size:40px}
.title_h3 {font-size:34px}
.title_h3 {font-size:28px}
.title_h4 {font-size:22px}
.title_h5 {font-size:16px}
.desc_p1 {font-size:48px}
.desc_p2 {font-size:40px}
.desc_p3 {font-size:32px}
.desc_p4 {font-size:24px}
.desc_p5 {font-size:16px}
.weight_100 {font-weight:100}
.weight_300 {font-weight:300}
.weight_400 {font-weight:400}
.weight_500 {font-weight:500}
.weight_700 {font-weight:700}
.weight_900 {font-weight:900}
/* 간격 */
.간격 {position:relative;overflow:hidden;background-color:rgb(216, 208, 255)}
.간격 .title {background:#fff}
.간격 .배경 {height:100px;background-color:#fff}
.간격 .간격들 {height:200px;line-height:200px;padding-left:50px;color:#000;font-size:20px}
.간격 .첫번째 {margin:50px  0;background:#fff}
.간격 .두번째 {margin:100px 0;background:#fff}
.간격 .세번째 {margin:150px 0;background:#fff}
.간격 .네번째 {margin:200px 0;background:#fff}
/* 버튼 */
.btn__wrap {margin:20px 0;overflow:hidden}
.btn {min-width:100px;margin:20px 0;padding:0 20px;line-height:60px;border-radius:50px;background:var(--deepPurple13);color:#fff;font-weight:bold;cursor:pointer;transition:all .5s ease-in-out}
.btn:hover {background:#2196f3}
.btn--small {min-width:80px}
.btn--medium {min-width:120px}
.btn--large {min-width:150px}
.btn--larger {min-width:200px}
.btn--responsive {min-width:100%;margin-bottom:20px}
.btn--half {display:block;float:left;min-width:calc(100% / 2)}
/* 색상 */
.색상 {overflow:hidden}
/* 라디오 */
.라디오체크버튼 input.radio-nomal{font-size:1em;width:1.25em;height:1.25em;vertical-align:middle}
.라디오체크버튼 input.radio-nomal + label{font-size:1.125em;vertical-align:top;margin-right:10px}
.라디오체크버튼 input.box-check{font-size:1em;width:1.25em;height:1.25em;vertical-align: middle}
.라디오체크버튼 input.box-check + label{font-size:1.125em;vertical-align:top;margin-right:10px}
.라디오체크버튼 input.style[type=checkbox]{display:none}
.라디오체크버튼 input.style[type=checkbox]+label{display:inline-block;cursor:pointer;height:24px;width:90px;border: 1px solid #333;line-height: 24px;text-align: center;font-weight:bold;font-size:13px}
.라디오체크버튼 input.style[type=checkbox]:checked+label{background-color:var(--deepPurple13);color:#fff}
.라디오체크버튼 input.style[type=radio]{display:none}
.라디오체크버튼 input.style[type=radio]+label{display:inline-block;cursor:pointer;height:24px;width:90px;border: 1px solid #333;line-height: 24px;text-align: center;font-weight:bold;font-size:13px}
.라디오체크버튼 input.style[type=radio]+label{background-color:#fff;color:#333}
.라디오체크버튼 input.style[type=radio]:checked+label{background-color:var(--deepPurple13);color:#fff}