﻿@charset "utf-8";

@import url('https://fonts.googleapis.com/css2?family=Nanum+Gothic:wght@400;700;800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@200;400;600;700;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Michroma&display=swap');
@import url('/font/atomy.css');
@import url('/font/ibmPlex.css');
/*** 공통class inc ***/
:root { 
	/*color*/
	--white-color:#fff;
	--black-color:#000;
	--big-lightgrey-color:#ededed;
	--lightgrey-color:#969696;
	--mediumgrey-color:#444;
	--yellow-color:#ffda0c;
	--red-color:#f32424;
	--blue-color:#0027ab;
	--orange-color:#f1760f;
	--main-color:#4eb092;
	--main-dark-color:#167c5d;
	--main-light-color:#8ae6ca;
	--sub1-color:#38f7d0;
	--sub1-dark-color:#0dc1b6;
	--sub1-light-color:#84f9e1;
	--sub2-color:#f5980a;
	--sub2-dark-color:#e5570a;
	--sub2-light-color:#f7df76;
	--tag1-color:#fed808; /*시사,정치*/
	--tag2-color:#bb9ef0; /*사회,경제, 관리단이야기*/
	--tag3-color:#e81b2a; /*교육,국제*/
	--tag4-color:#f37826; /*예능,라이프,현장속뉴스*/
	--tag5-color:#0dc1b6; /*집합건물분쟁*/
	--tag6-color:#43eb83; /*문화*/
	--sub-color:#fabb23;
	--gracolor-in:#43ea80;
	--gracolor-out:#38f8d4;
	--gracolor2-in:#b7cfe2;
	--gracolor2-out:#fafbfc;
	--gracolor3-in:#2ad8d2;
	--gracolor3-out:#2a7cd8;
	--opacity-down:.65;
	/*size*/
	--font-size-main-title:36px;
	--font-size-medium:26px;
	--font-size-sub-title:20px;
	--font-size-snor:18px;
	--font-size-nor:16px;
	--font-size-sm:14px;
	--font-size-bsm:12px;
	/*font-style*/
	--font-family-atm:'Atomy-medium';
	--font-family-ibm: 'IBM-medium';
	--font-weight100:100;
	--font-weight200:200;
	--font-weight300:300;
	--font-weight600:600;
	/*font-family*/
	--font-family-ibm-light:'IBM-light';
	--font-family-ibm-regular:'IBM-regular';
	--font-family-ibm-medium:'IBM-medium';
	--font-family-ibm-bold:'IBM-bold';
	--font-family-atm-light:'Atomy-light';
	--font-family-atm-medium:'Atomy-medium';
	--font-family-atm-bold:'Atomy-bold';
	--font-family-defualt: 'Noto Sans KR','Nanum Gothic','나눔고딕', sans-serif;
	/*default*/
	--z-index-absolute:100001;
	--z-index:9999;
	--z-index900:900;
	--z-index500:500;
	--z-index-back:-1;
	/*partner_network*/
	--partner-color:#4c6cc7;
	--partner-dark-color:#00215a;
	--ranking1-color:#189e98; /*바른기업*/
	--ranking2-color:#13a060; /*성실기업*/
	--ranking3-color:#2660f1; /*착한기업*/

}
/*CSS사용법
.bodyMcol {color:var(--main-color); font-weight:var(--font-weight100);}
.bodyMsize {color:var(--white-color); font-size:var(--font-size36); font-family:var(--font-family-atm); background: linear-gradient(90deg, var(--gracolor-in), var(--gracolor-out));}
.bodySsize { font-size: var(--font-size14); font-family: var(--font-family-ibm); color: var(--lightgrey-color); font-weight: var(--font-weight600); }
*/

/***** reset *****/
* { margin: 0; padding: 0; font-family: var(--font-family-ibm), 'Noto Sans KR','Nanum Gothic','나눔고딕', sans-serif; box-sizing: border-box; letter-spacing: -0.7px; }
html, body, div, object, iframe, h1, h2, h3, h4, h5, h6, p, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, canvas, details, figcaption, summary, time, mark, audio, video, button { margin: 0; padding: 0; font-family: var(--font-family-ibm), 'Noto Sans KR','Nanum Gothic','나눔고딕', sans-serif; font-size: 15px; font-weight: normal; line-height: 180%; list-style-type: none; text-decoration: none; color: #000; letter-spacing: 0; word-break: keep-all; transition-delay: .35s; transition: .45s; scroll-behavior: smooth;}
table { empty-cells: show; border-collapse: collapse; border-spacing: 0; }
input[type=text], input[type=password], textarea, select { vertical-align: middle; border: 1px solid #c9c9c9; font-family: var(--font-family-ibm-bold), 'Noto Sans KR','Nanum Gothic','나눔고딕', sans-serif; /*font-weight: bold;*/ color: var(--black-color); cursor: pointer; }
select { padding: 1px; vertical-align: top; font-family: var(--font-family-ibm), 'Noto Sans KR','Nanum Gothic','나눔고딕', sans-serif; font-weight: bold; }
body ::selection {background:var(--main-light-color); color: var(--black-color);}

/****** common *****/
fieldset { border: 0; }
caption { display: block; position: fixed; top: -50000px; margin: 0; padding: 0; width: 0; height: 0; text-indent: -50000px; border: 0; }
button{background:0;border:0;outline:0;font-size:inherit;font-weight:inherit;font-family:inherit}
button img{left:-3px;*left:auto}
.skip { position: relative; overflow: hidden; text-indent: -50000; font-size: 0; margin: 0; padding: 0; width: auto; }
.hidden { overflow: hidden !important; margin: 0 !important; padding: 0 !important; font-size: 0 !important; width: 0 !important; height: 0 !important; }
.ir { overflow: hidden; display: block; width: auto; height: auto; font-size: 0; text-indent: -50000; }
.right { text-align: right !important; }
.left { text-align: left !important; }
.center { text-align: center !important; }
.wfont {font-weight:600; /*font-weight: bold;*/ }
.bfont { font-size: 1.3em; }
.sfont { font-size: .9rem; }
.fst_eng { font-family: 'Michroma', 'Noto Sans KR','Nanum Gothic','나눔고딕', sans-serif !important; line-height: 100%; }
.error_msg {margin-top:5px;font-size:12px;color:#e03723 !important;}
/*.dp_pc { display: block !important;  font-family:'IBMPlexSansKR-Regular'; font-weight:normal;}*/
.pc_block { display: block !important; font-weight: normal; }
.dp_mb { display: none !important; }
.tbox { display: block; overflow: hidden; position: relative; width: 100%; margin: 70px auto; padding: 50px 90px; border-top: 2px solid #fabb23; border-bottom: 1px solid #fabb23; background: #fff; text-align:center; word-break: keep-all; }
.tbox::before { position:absolute; left:0; bottom:-5px; width:100%; height:1px; content:''; background:#fabb23; }
.tbox::after { position:absolute; left:0; bottom:2px; width:100%; height:1px; content:''; background:#fabb23; }
.s_tbox {display:block; position:relative; width:100%; padding:22px; background:#fff; box-shadow:5px 0 18px rgba(0,0,0,.18);}
a { text-decoration: none; color: #000; }
/*a:hover {transition:.5s all; font-weight:500;}*/
.grey { color: var(--midiumgrey-color); }
.red { color: var(--red-color) !important; }
.orange { color: var(--orange-color); }
.blue { color: var(--blue-color); }
.point { font-weight:var(--font-weight600); text-decoration: dashed; color:var(--main-dark-color);}
.under:hover {text-decoration: underline;}
.bd_L { border-left: 1px solid #d6d6d6; box-sizing: border-box; opacity: 1 !important }
.bd_R { border-right: 1px solid #d6d6d6; box-sizing: border-box; opacity: 1 !important }
.bd_B { border-bottom: 1px solid #d6d6d6; box-sizing: border-box; opacity: 1 !important }
.bd_T { border-top: 1px solid #d6d6d6; box-sizing: border-box; opacity: 1 !important }
.bd_Tpoint { border-top: 2px solid #222; box-sizing: border-box; opacity: 1 !important }
.bd_N { border: 0 !important; }
.tag { display: inline-block; color: #fff; text-align: center; padding: 3px; margin-right: 5px; font-size: 14px; font-weight: 400; text-align: center; width: 84px; height: 100%; line-height: 20px; }
.stag { display: inline-block; color: #fff; text-align: center; padding: 0; margin-right: 3px; font-size: 13px; font-weight: 200; text-align: center; width: 79px; height: 100%; line-height: 20px; }
.tg_new, .tg_green { background-color: #41b0b7; }
.tg_ing, .tg_blue { background-color: #4a75cb; }
.tg_end, .tg_red { background-color: #ef4f4f; }
.tg_none, .tg_grey { background-color: #616161; }
.tg_black { background-color: #111; }
.bx_grey { background: #888 !important; border-color: #888 !important; box-sizing: border-box; }
.bx_blue { background: #5357cc !important; border-color: #5357cc !important; box-sizing: border-box; }
.bx_green { background: #0aaeb7 !important; border-color: #0aaeb7 !important; box-sizing: border-box; }
.bx_red { background: #d9534f !important; border-color: #d9534f !important; box-sizing: border-box; }
.bx_yellow { background: #fddd09 !important; border-color: #fddd09 !important; box-sizing: border-box; color: #111 !important; }
.bx_white { background: #fff !important; border-color: #1e5ebc !important; box-sizing: border-box; color: #1e5ebc !important; }
.bx_grey:hover { background: #636363 !important; border-color: #656565 !important; }
.bx_blue:hover { background: #1d2088 !important; border-color: #1d2088 !important;}
.bx_green:hover { background: #059199 !important; border-color: #059199 !important;}
.bx_red:hover { background: #b82020 !important; border-color: #b82020 !important;}
.bx_yellow:hover { background: #e38805 !important; border-color: #e38805 !important;}
.gradient_blue {background:linear-gradient(45deg,#6568d8,#16bac4);}
.gradient_purple {background:linear-gradient(45deg,#7c52d2,#5021af);}
.flex_wrap {display:flex; flex-wrap:wrap; flex-direction:row; justify-content:space-between; width:100%;}
.flex_center {display:flex; flex:1 1 auto; flex-wrap:wrap; flex-direction:row; justify-content:center; gap:3rem;}
.flex_left {display:flex; flex:1 1 auto; flex-wrap:wrap; flex-direction:row; justify-content:left; gap:3rem;}
.flex_right {display:flex; flex:1 1 auto; flex-wrap:wrap; flex-direction:row; justify-content:right; gap:3rem;}
.flex_between {display:flex; flex:1 1 auto; flex-direction:row; justify-content:space-between; align-items:stretch; gap:3rem;}
.flex_column {display:flex; flex:1 1 auto; flex-wrap:wrap; flex-direction:column; justify-content:space-between; gap:3rem;}
/*tag_BackgroundColor*/
.Bcolor_all { background: #222; }
.Bcolor_etc { background: #b5b5b5; }
.Bcolor1 { background: #293a6c; }
.Bcolor2 { background: #3ea1d9; }
.Bcolor3 { background: #1fcb90; }
.Bcolor4 { background: #ef5b34; }
.Bcolor5 { background: #991bd3; }
.Bcolor6 { background: #436be3; }
.Bcolor7 { background: #22bbc1; }
.Bcolor8 { background: #fddd09; }
.Bcolor9 { background: #eb2945; }
.Bcolor10 { background: #cf35c6; }
.Bcolor11 { background: #58b316; }
.Bcolor12 { background: #5b5b5b; }
.Bcolor13 { background: #be1c7f; }
/*tag_TxtColor*/
.Btxtcolor_all { color: #222; }
.Btxtcolor_etc { color: #b5b5b5; }
.Btxtcolor1 { color: #293a6c; }
.Btxtcolor2 { color: #3ea1d9; }
.Btxtcolor3 { color: #1fcb90; }
.Btxtcolor4 { color: #ef5b34; }
.Btxtcolor5 { color: #991bd3; }
.Btxtcolor6 { color: #436be3; }
.Btxtcolor7 { color: #22bbc1; }
.Btxtcolor8 { color: #fddd09; }
.Btxtcolor9 { color: #eb2945; }
.Btxtcolor10 { color: #cf35c6; }
.Btxtcolor11 { color: #58b316; }
.Btxtcolor12 { color: #5b5b5b; }
.Btxtcolor13 { color: #be1c7f; }
/*paragraph*/
.para1 { margin: 30px 10px 20px; }
.para1_1 { margin: 60px 0 20px 0; }
.para2 { padding: 0 15px 15px; }
.para3 { padding: 0 23px 7px; }
.para4 { padding: 0 30px 5px; }
/*tagColor*/
.item1.tag {background:var(--tag1-color);}/*시사,정치*/
.item2.tag {background:var(--tag2-color);}/*사회,경제, 관리단이야기*/
.item3.tag {background:var(--tag3-color);}/*교육,국제*/
.item4.tag {background:var(--tag4-color);}/*예능,라이프,현장속뉴스*/
.item5.tag {background:var(--tag5-color);}/*집합건물분쟁*/
.item6.tag {background:var(--tag6-color);}/*문화*/

/*공통PROGRAM STYLE*/
/******* Button Style ******/
.btn_center {display:block; margin:0 auto; text-align:center;}
.btn_st { overflow: hidden; }
.btn_st a, input.btn_st { position: relative; display: inline-block; line-height: 24px; padding: 8px 15px; text-decoration: none; font-size: 15px; text-align: center; color: #fff; border: 1px solid #343848; background: #45495b; }
.btn_st a:hover, input.btn_st:hover { text-decoration: underline; }
.btn_st a.blue, input.btn_st.blue { color: #fff; border-bottom: 1px solid #1e5ebc; border-right: 1px solid #1e5ebc; background: #2f71d2; }
.btn_st a.green, input.btn_st.green { color: #fff; border-bottom: 1px solid #3e9416; border-right: 1px solid #3e9416; background: #52ae27; }
.btn_st a.yellow, input.btn_st.yellow { color: #fff; border-bottom: 1px solid #3e9416; border-right: 1px solid #3e9416; background-color: #f0ad4e; border-color: #f0ad4e }
.btn_st a.red, input.btn_st.red { background-color: #d9534f; border-color: #d9534f }
.btn_st a.line, input.btn_st.line { padding: 7px 15px 8px; color: #222; border: 1px solid #9298af; background: #fff; }
.btn_st a.blue_l, input.btn_st.blue_l { padding: 7px 15px 8px; color: #1e5ebc; border: 1px solid #1e5ebc; background: #fff; }
.btn_st a.green_l, input.btn_st.green_l { padding: 7px 15px 8px; color: #42991a; border: 1px solid #42991a; background: #fff; }
.btn_st a.mini { padding: 2px 8px; font-size: 12px; font-weight: bold; }
.conbtn, input.conbtn { position: relative; overflow: hidden; display: inline-flex; flex-direction:column; flex:1 1 auto; justify-content:center; align-items:center; text-align: center; margin: 0 2px; padding: 10px 20px; min-width: 74px; line-height: normal; color: #fff; background: #3b3b3b; transition: .3s; z-index: 1; font-size: var(--font-size-nor); font-weight: 300; vertical-align: middle; border: 1px solid #3b3b3b; box-sizing: border-box; border-radius:7px; }
.conbtn.w150, input.conbtn.w150 {max-width:150px; }
.conbtn:hover, input.conbtn:hover { box-shadow:0 5px 10px rgba(0,0,0,.23);}
.conbtn.btn_lg { padding: 10px 50px; min-width: 120px; }
.conbtn.btn_sm { padding: 3px 8px; min-width: 70px; font-size: 12px; }
.conbtn:after, input.conbtn:after { position: absolute; content: ''; top: 50%; left: 50%; width: 0; height: 100%; background: linear-gradient(45deg, #1e5ebc, #3e9416); opacity: 0; transition: .3s; transform: translateX(-50%) translateY(-50%); -webkit-transform: translateX(-50%) translateY(-50%); -moz-transform: translateX(-50%) translateY(-50%); -ms-transform: translateX(-50%) translateY(-50%); z-index: -1; }
.check_info {margin:16px 0 0;}
.check_info .login_check_box {display:block;position:relative;}
.check_info label {margin-left:2px;font-size:12px;color:#121212;cursor:pointer;}
.check_info input {width:19px;height:19px;border:0;background:url("/img/sub/icon_chk01_off.png") no-repeat 0 0;background-size:19px 19px;cursor:pointer;}
.check_info input:checked {background:url("/img/sub/icon_chk01_on.png") no-repeat 0 0;background-size:19px 19px;}
.nickname_con {position:relative;}
.nickname_con .nickname_reset {display:block;position:absolute;top:14px;right:13px;width:20px;height:20px;background:url("/img/sub/icon_nick_reset.png") no-repeat center 5px;background-size:10px 10px;text-indent:-9999px;}
.btn_next {display:block;height:49px;line-height:49px;background:#121212;margin:29px 0 15px;text-align:center;font-size:16px;color:#fff;font-weight:bold;border-radius:3px;}
.btn_next03 {display:block;height:49px;line-height:49px;background:#e5e5e5;margin:29px 0 15px;text-align:center;font-size:16px;color:#5a5a5a;font-weight:bold;border-radius:3px;}
.btn_next03.on {display:block;height:49px;line-height:49px;background:#121212;margin:29px 0 15px;text-align:center;font-size:16px;color:#fff;font-weight:bold;border-radius:3px;}
/*checkbox/radiobox*/
.checks { position: relative; }
.checks input[type="checkbox"] { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); border: 0; }
.checks input[type="checkbox"] + label { display: block; position: relative; cursor: pointer; font-size: 16px; margin-right: 20px; -webkit-user-select: none; -ms-user-select: none; -moz-user-select: none; }
.checks input[type="checkbox"] + label::before { display: inline-block; content: ''; width: 18px; height: 18px; line-height: 18px; margin: -2px 8px 0 0; text-align: center; vertical-align: middle; background: #f9f9f9; border: 1px solid var(--big-lightgrey-color); border-radius: 0; transition:.34s all;}
.checks input[type="checkbox"] + label::after {display:inline-block; position:absolute; left:0; top:0; font-size:24px; color:#4043be}
.checks input[type="checkbox"]:checked + label::before {content:'✔'; color: #4043be; font-weight: bold; font-size:14px; background:var(--white-color); border-color:#4043be; border:1px dotted #4043be; border-radius:3px; }
.checks input[type="checkbox"]:checked + label {color:#363370 }
.checks input[type="radio"] { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); border: 0; }
.checks input[type="radio"] + label { display: inline-block; position: relative; cursor: pointer; font-size: 15px; margin-right: 20px; -webkit-user-select: none; -ms-user-select: none; -moz-user-select: none; }
.checks input[type="radio"] + label::before { display: inline-block; content: ''; left: 0; width: 18px; height: 18px; line-height: 18px; text-align: center; background: #fff; border: 1px solid #b6b6b6; border-radius: 100%; vertical-align: middle; margin-right: 5px; }
.checks input[type="radio"]:checked + label::before { content: ''; border-color: #111; background: #fff; }
.checks input[type="radio"]:checked + label::after { content: ''; position: absolute; top: 10px; left: 4px; width: 10px; height: 10px; background: #111; border-radius: 100%; box-shadow: inset 0 0 10px rgba(0,0,0,.3); }
/*댓글*/
.comment { padding: 3.5% 4%; border: 6px solid #eee; background: #fff; }
.comment div.commentForm { position: relative; padding-right: 140px; }
.comment div.commentForm textarea { margin: 0 auto; padding: 10px 2%; width: 96%; height: 68px; background: #EEE; border: 1px solid #ddd; line-height: 150%; }
.comment div.commentForm input[type=submit] { position: absolute; right: 0px; top: 0px; width: 140px; height: 90px; font-size: 18px; background: #fff; border: 1px solid #ccc; color: #333 }
/*답변*/
.answer { margin-top: 40px; }
.answer_tit { display: block; position: relative; width: 100%; margin-bottom: 20px; padding-left: 48px; background: url('../Img/sub/answer_list_tit.png') no-repeat left top; }
.answer_tit span { display: inline-block; position: relative; width: auto; font-size: 22px; color: #406cc5; font-weight: 600; padding: 0 5px; z-index: 11; }
.answer_tit span::after { position: absolute; content: ''; background: #b2f0fb; width: 100%; height: 13px; top: 18px; left: 0; z-index: -1; }
.answer .list > p { display: block; width: 100%; padding: 10px 20px; }
.answer .list .q { color: #222; font-weight: 500; font-size: 17px; background: #f1f1f1; }
.answer .list .sq { margin-left: 15px; color: #555; font-weight: 300; font-size: 14px; }
.answer .list .a { border-top: 1px dashed #aaa; background: #f8f8f8; }
/*데이터없음*/
.nodata { width: 100%; text-align: center; padding: 30px 0 0 !important; margin: 0 0 30px; }
.nodata > p { position: relative; font-size: 17px; color: #6f6f6f; }
.nodata > p::before { display: block; content: '!'; width: 45px; height: 45px; line-height: 50px; font-size: 50px; color: #222; font-weight: 300; margin: 0 auto 20px; }

/*사이트 준비중 str*/
body.siteingBg {display:block; position:fixed; overflow:hidden; padding:5%; width:100%; height:100%; text-align:center; background-color:#F0F3FB;}
body.siteingBg::before {position:absolute; right:0; top:0; content:''; width:600px; height:535px; background:url('/img/inc/siteingBgT.png') no-repeat;  z-index:-2;}
body.siteingBg::after {position:absolute; left:0; bottom:0; content:''; width:1025px; height:561px; background:url('/img/inc/siteingBgB.png') no-repeat; z-index:-1;}
body.siteingBg .boxBg {overflow:hidden; max-width:1108px; height:100%; margin:0 auto; background:url('/img/inc/siteingImg.png') no-repeat center top; background-size:100%;}
body.siteingBg .txt {padding:15% 0 30%; text-align:left;}
body.siteingBg .txt p {font-size:20px; margin:20px 0 40px;}
body.siteingBg .txt .subtit {opacity:.23; letter-spacing:0;}
body.siteingBg .txt .title { font-size:46px; color:#294e97; font-weight:800; line-height:24px;}
body.siteingBg .txt span {font-size:24px; color:#555; font-weight:300; line-height:26px;}
@media screen and (max-width:1500px) {
	body.siteingBg .txt {padding:30% 0 30%; text-align:left; }
}
@media screen and (max-width:800px) {
	body.siteingBg {background-image:url('/img/inc/siteingBgmb.gif'); background-repeat:no-repeat; background-position:center top; }
	body.siteingBg::before, body.siteingBg::after {display:none;}
	body.siteingBg .boxBg {background-position:center bottom;}
	body.siteingBg .txt {padding:25% 0 0; text-align:left; background-color:rgba(255,255,255,.4);}
	body.siteingBg .txt p {margin:20px 0; text-align:center;}
	body.siteingBg .txt .subtit {opacity:.6;}
	body.siteingBg .txt .title {font-size:3rem; line-height:60px;}
	body.siteingBg .txt span {font-size:1.25rem; line-height:30px;}
}
/*사이트 준비중 end*/
/*말줄임*/
.txt-webkitbox{display : -webkit-box; overflow : hidden; text-overflow : ellipsis; -webkit-line-clamp : 2/*줄수*/; -webkit-box-orient : vertical;}
.txt-webkitbox.line3{-webkit-line-clamp : 3;}
.txt-webkitbox.line4{-webkit-line-clamp : 4;}
.txt-webkitbox.line5{-webkit-line-clamp : 5;}
.txt-webkitbox.line6{-webkit-line-clamp : 6;}
.txt-ellipsis{display:block; overflow:hidden; width:98%; text-overflow:ellipsis; white-space:nowrap;}
/*swiper-style*/

/************************** input Box ******************************/
/* input_fix */
.input50 { width: 50px !important }
.input80 { width: 80px !important }
.input100 { width: 100px !important }
.input150 { width: 150px !important }
.input200 { width: 200px !important }
.input250 { width: 250px !important }
.input300 { width: 300px !important }
.input350 { width: 350px !important }
.input400 { width: 400px !important }
.input450 { width: 450px !important }
.input500 { width: 500px !important }

/* input_% */
.inputw5 { width: 5% !important }
.inputw7 { width: 7% !important }
.inputw10 { width: 10% !important }
.inputw20 { width: 20% !important }
.inputw30 { width: 30% !important }
.inputw40 { width: 40% !important }
.inputw50 { width: 50% !important }
.inputw60 { width: 60% !important }
.inputw70 { width: 70% !important }
.inputw80 { width: 80% !important }
.inputw90 { width: 90% !important }
.inputw100 { width: 100% !important }

/* input_h */
.h10 { height: 10px !important }
.h15 { height: 15px !important }
.h20 { height: 20px !important }
.h30 { height: 30px !important }
.h40 { height: 40px !important }
.h42 { height: 42px !important; margin-top: -2px; }
.h50 { height: 50px !important }
.h80 { height: 80px !important }
.h100 { height: 100px !important }
.h150 { height: 150px !important }
.h200 { height: 200px !important }
.h250 { height: 250px !important }
.h300 { height: 300px !important }
.h350 { height: 350px !important }
.h400 { height: 400px !important }
.h450 { height: 450px !important }
.h500 { height: 500px !important }

/****** select Box *****/
.select_50 { width: 50px !important }
.select_80 { width: 80px !important }
.select_100 { width: 100px !important }
.select_120 { width: 120px !important }
.select_150 { width: 150px !important }
.select_200 { width: 200px !important }
.select_250 { width: 250px !important }

/****** margin/padding *****/
.mg_0 { margin: 0 !important; }
.mg_5 { margin: 5px !important; }
.mg_10 { margin: 10px !important; }
.mg_20 { margin: 20px !important; }
.mg_30 { margin: 30px !important; }
.mg_40 { margin: 40px !important; }
.mg_50 { margin: 50px !important; }
.mg_60 { margin: 60px !important; }
.mg_70 { margin: 70px !important; }
.mg_80 { margin: 80px !important; }
.mg_t0 { margin-top: 0 !important; }
.mg_t5 { margin-top: 5px !important; }
.mg_t10 { margin-top: 10px !important; }
.mg_t20 { margin-top: 20px !important; }
.mg_t30 { margin-top: 30px !important; }
.mg_t40 { margin-top: 40px !important; }
.mg_t50 { margin-top: 50px !important; }
.mg_t60 { margin-top: 60px !important; }
.mg_t70 { margin-top: 70px !important; }
.mg_t80 { margin-top: 80px !important; }
.mg_t90 { margin-top: 90px !important; }
.mg_t100 { margin-top: 100px !important; }
.mg_l0 { margin-left: 0 !important; }
.mg_l5 { margin-left: 5px !important; }
.mg_l10 { margin-left: 10px !important; }
.mg_l20 { margin-left: 20px !important; }
.mg_l30 { margin-left: 30px !important; }
.mg_l40 { margin-left: 40px !important; }
.mg_l50 { margin-left: 50px !important; }
.mg_l60 { margin-left: 60px !important; }
.mg_l70 { margin-left: 70px !important; }
.mg_l80 { margin-left: 80px !important; }
.mg_l90 { margin-left: 90px !important; }
.mg_l100 { margin-left: 100px !important; }
.mg_r0 { margin-right: 0 !important; }
.mg_r5 { margin-right: 5px !important; }
.mg_r10 { margin-right: 10px !important; }
.mg_r20 { margin-right: 20px !important; }
.mg_r30 { margin-right: 30px !important; }
.mg_r40 { margin-right: 40px !important; }
.mg_r50 { margin-right: 50px !important; }
.mg_r60 { margin-right: 60px !important; }
.mg_r70 { margin-right: 70px !important; }
.mg_r80 { margin-right: 80px !important; }
.mg_r90 { margin-right: 90px !important; }
.mg_r100 { margin-right: 100px !important; }
.mg_b0 { margin-bottom: 0 !important; }
.mg_b5 { margin-bottom: 5px !important; }
.mg_b10 { margin-bottom: 10px !important; }
.mg_b20 { margin-bottom: 20px !important; }
.mg_b30 { margin-bottom: 30px !important; }
.mg_b40 { margin-bottom: 40px !important; }
.mg_b50 { margin-bottom: 50px !important; }
.mg_b60 { margin-bottom: 60px !important; }
.mg_b70 { margin-bottom: 70px !important; }
.mg_b80 { margin-bottom: 80px !important; }
.mg_b90 { margin-bottom: 90px !important; }
.mg_b100 { margin-bottom: 100px !important; }
.pd_0 { padding: 0 !important; }
.pd_5 { padding: 5px !important; }
.pd_10 { padding: 10px !important; }
.pd_20 { padding: 20px !important; }
.pd_30 { padding: 30px !important; }
.pd_40 { padding: 40px !important; }
.pd_50 { padding: 50px !important; }
.pd_60 { padding: 60px !important; }
.pd_70 { padding: 70px !important; }
.pd_80 { padding: 80px !important; }
.pd_90 { padding: 90px !important; }
.pd_100 { padding: 100px !important; }
.pd_t0 { padding-top: 0 !important; }
.pd_t5 { padding-top: 5px !important; }
.pd_t10 { padding-top: 10px !important; }
.pd_t20 { padding-top: 20px !important; }
.pd_t30 { padding-top: 30px !important; }
.pd_t40 { padding-top: 40px !important; }
.pd_t50 { padding-top: 50px !important; }
.pd_t60 { padding-top: 60px !important; }
.pd_t70 { padding-top: 70px !important; }
.pd_t80 { padding-top: 80px !important; }
.pd_t90 { padding-top: 90px !important; }
.pd_t100 { padding-top: 100px !important; }
.pd_l0 { padding-left: 0 !important; }
.pd_l5 { padding-left: 5px !important; }
.pd_l10 { padding-left: 10px !important; }
.pd_l20 { padding-left: 20px !important; }
.pd_l30 { padding-left: 30px !important; }
.pd_l40 { padding-left: 40px !important; }
.pd_l50 { padding-left: 50px !important; }
.pd_l60 { padding-left: 60px !important; }
.pd_l70 { padding-left: 70px !important; }
.pd_l80 { padding-left: 80px !important; }
.pd_l100 { padding-left: 100px !important; }
.pd_r0 { padding-right: 0px !important; }
.pd_r5 { padding-right: 5px !important; }
.pd_r10 { padding-right: 10px !important; }
.pd_r20 { padding-right: 20px !important; }
.pd_r30 { padding-right: 30px !important; }
.pd_r40 { padding-right: 40px !important; }
.pd_r50 { padding-right: 50px !important; }
.pd_r60 { padding-right: 60px !important; }
.pd_r70 { padding-right: 70px !important; }
.pd_r80 { padding-right: 80px !important; }
.pd_r90 { padding-right: 90px !important; }
.pd_r100 { padding-right: 100px !important; }
.pd_b0 { padding-bottom: 0 !important; }
.pd_b5 { padding-bottom: 5px !important; }
.pd_b10 { padding-bottom: 10px !important; }
.pd_b20 { padding-bottom: 20px !important; }
.pd_b30 { padding-bottom: 30px !important; }
.pd_b40 { padding-bottom: 40px !important; }
.pd_b50 { padding-bottom: 50px !important; }
.pd_b60 { padding-bottom: 60px !important; }
.pd_b70 { padding-bottom: 70px !important; }
.pd_b80 { padding-bottom: 80px !important; }
.pd_b90 { padding-bottom: 90px !important; }
.pd_b100 { padding-bottom: 100px !important; }


/* width */
.w10 { width: 7%; }
.w15 { width: 13%; }
.w25 { width: 24.5%; }
.w30 { width: 29.99999%; }
.w40 { width: 39.99999%; }
.w50 { width: 45.99999%; }
.w70 { width: 68%; margin:0 auto;}
.w90 { width: 90%; }
.w100 { width: 100%; }

@media screen and (max-width:1030px) {
	
	.mb_hidden { display: none !important; }
	.mb_block {display:block !important; width:100%;}
	.pc_block {display:inline !important;}
	.mb_block480 {display:inline-block !important;}
	.w70 {width:100%;}
}

@media screen and (max-width:990px) {
	:root {
	/*size*/
	--font-size-main-title:2rem;
	--font-size-medium:1.5rem;
	}
	.dp_pc { display: none !important; }
	.dp_mb { display: block !important; }
	.tbox{margin:24px 0; padding:35px;}
}

@media screen and (max-width:900px) {
	.flex_wrap, .flex_left, .flex_center, .flex_right, .flex_between, .flex_column {display:block; width:100%; margin:0 auto;}
}
@media screen and (max-width:648px) {
	.mb_sblock, .mb_block480 {display:block !important;}
	
}
