body { font-family: Arial, sans-serif; margin: 0; padding: 0; }
h1 { text-align: left; padding: 20px; background-color: #eee; font-size: 20px; }
h2 { text-align: left; padding: 20px; font-size: 16px; margin: 10px; }
h2.pd_none { padding-top: 0 !important; padding-bottom: 0 !important;}
h2 span { border: #007bff solid 2px; padding: 5px; margin-right: 5px; border-radius: 3px; line-height: 30px;}
h2 span.area { display: inline-block; width: 90px; padding: 0; text-align: center; }
.clear { clear: both;}
/* QR-정보 */
.p_h01 { border-color: #46BCB4; }
.p_h02 { border-color: #F5A339; }
.p_h03 { border-color: #6DBA43; }
.p_h04 { border-color: #68A3D8; }
.p_h05 { border-color: #C486B8; }

.p_hai01 { border-color: #FDD000; }
.p_hai02 { border-color: #F6BED0; }
.p_hai03 { border-color: #B2E0F8; }
.p_hai04 { border-color: #C1DA75; }

.p_hsw01 { border-color: #70C7D1; }
.p_hsw02 { border-color: #F29154; }
.p_hsw03 { border-color: #8477B6; }
.p_hsw04 { border-color: #49BA9D; }
.p_hsw05 { border-color: #EC6D6C; }

.p_art01 { border-color: #f0b71a; }
.p_art02 { border-color: #9685de; }
.p_art03 { border-color: #EC6D6C; }
.p_art04 { border-color: #46BCB4; }

.btn { padding: 0; text-align: left; margin: 20px 30px;}
.btn a { display: inline-block; padding: 10px 20px; text-decoration: none; color: #fff; background-color: #007bff; border-radius: 5px; transition: background-color 0.3s; }
.btn a:hover { background-color: #0056b3; }

.high_01 a { background-color: #46BCB4; }
.high_01 a:hover { background-color: #3fa7a0; }
.high_02 a { background-color: #F5A339; }
.high_02 a:hover { background-color: #df9534; }
.high_03 a { background-color: #6DBA43; }
.high_03 a:hover { background-color: #5c9d38; }
.high_04 a { background-color: #68A3D8; }
.high_04 a:hover { background-color: #588bb8; }
.high_05 a { background-color: #C486B8; }
.high_05 a:hover { background-color: #ad76a2; }

.high_ai01 a { background-color: #FDD000; }
.high_ai01 a:hover { background-color: #e6bb00; }
.high_ai02 a { background-color: #F6BED0; }
.high_ai02 a:hover { background-color: #d5a5b5; }
.high_ai03 a { background-color: #B2E0F8; }
.high_ai03 a:hover { background-color: #a2cbe1; }
.high_ai04 a { background-color: #C1DA75; }
.high_ai04 a:hover { background-color: #a8bd67; }

.high_sw01 a { background-color: #70C7D1; }
.high_sw01 a:hover { background-color: #62b2bb; }
.high_sw02 a { background-color: #F29154; }
.high_sw02 a:hover { background-color: #d8824c; }
.high_sw03 a { background-color: #8477B6; }
.high_sw03 a:hover { background-color: #7469a2; }
.high_sw04 a { background-color: #49BA9D; }
.high_sw04 a:hover { background-color: #44ab92; }
.high_sw05 a { background-color: #EC6D6C; }
.high_sw05 a:hover { background-color: #d46161; }

.etc_box { display: block; clear: both; margin: 0; padding: 0; }
.etc_box dt { float: left; display: block; margin: 0; padding: 0;}
.etc_box dd { float: left; display: block; margin: 0; padding: 0;}

/* QR-미술 */
.art_box { display: block; clear: both; margin-bottom: 10px; padding: 0; }
.art_box dt { float: left; display: block; margin: 0; padding: 0; width: 450px; }
.art_box dt h2 { padding: 0 20px; margin: 5px 20px; }
.art_box dd { float: left; display: block; }
.art_mg { margin: 5px; }

/* QT-한국사 */
.history_body { width: 900px; margin: 0 auto; }
table { border-collapse: collapse; border-spacing: 0; } 
caption { overflow: hidden; width: 0; height: 0; font-size: 0; line-height: 0; } 
th,td { vertical-align: middle; /* white-space: nowrap */ } 
.history_title { display: flex; justify-content: flex-start; align-items: flex-end; margin-top: 20px;}
.history_title h1 { background-color: #49BA9D; margin: 0; border: 2px solid #49BA9D; border-top-left-radius: 30px; border-top-right-radius: 30px; padding: 10px 20px; margin-left: 40px; color: #fff; font-size: 20px; }
.history_title h2 { margin: 0; padding: 10px 20px; }
.history_tit02 { display: flex; justify-content: flex-start; align-items: flex-end; margin-top: 20px;}
.history_tit02 h1 { background-color: #ba49a5; margin: 0; border: 2px solid #ba49a5; border-top-left-radius: 30px; border-top-right-radius: 30px; padding: 10px 20px; margin-left: 40px; color: #fff; font-size: 20px; }
.history_tit02 h2 { margin: 0; padding: 10px 20px; }

.history_box { border: 5px solid #49BA9D; border-radius: 30px; margin: 0 10px 10px; padding: 30px; }
.history_box2 { border: 5px solid #ba49a5; border-radius: 30px; margin: 0 10px 10px; padding: 30px; }

.table_history { width: 100%; border-collapse: separate; border-spacing: 0; font-size: 14px;} 
.table_history th { text-align: center; padding: 8px; border-top: 2px solid #cdcdcd; border-bottom: 2px solid #cdcdcd; border-left: solid 1px #ddd; background-color: #e8e8e8; } 
.table_history td { text-align: left; padding: 10px; border-bottom: 1px solid #ddd; border-left: 1px solid #ededed; } 
.table_history th:nth-child(1) { border-left: 0;}
.table_history td:nth-child(1) { border-left: 0;}
.table_history td.txt_c { text-align: center; } 
.table_history td a { color: #222; text-decoration: none;}
.table_history td a:hover { font-weight: bold; color: #222; }

@media (max-width: 480px) {
body.history_body { width: 100%; }
.history_title { margin-top: 10px;}
.history_title h1 { border-top-left-radius: 15px; border-top-right-radius: 15px; padding: 10px; margin-left: 25px; font-size: 16px; }
.history_title h2 { font-size: 14px; padding: 10px; }
.history_tit02 { margin-top: 10px;}
.history_tit02 h1 { border-top-left-radius: 15px; border-top-right-radius: 15px; padding: 10px; margin-left: 25px; font-size: 16px; }
.history_tit02 h2 { font-size: 14px; padding: 10px; }

.history_box { border: 2px solid #49BA9D; border-radius: 20px; margin: 0 5px 5px; padding: 10px; }
.history_box2 { border: 2px solid #ba49a5; border-radius: 20px; margin: 0 5px 5px; padding: 10px; }
.table_history th,.table_history td { letter-spacing: -1px; padding: 5px 10px; }
.table_history th,.txt_s { font-size: 11px; letter-spacing: -1px;}
}