main_qmenu2@charset "utf-8";
@import url('https://cdn.rawgit.com/innks/NanumSquareRound/master/nanumsquareround.min.css');
@import url(https://cdn.jsdelivr.net/gh/moonspam/NanumSquare@1.0/nanumsquare.css);
@import url(https://cdn.rawgit.com/moonspam/NanumSquare/master/nanumsquare.css);
a {text-decoration: none;}
a:link {text-decoration: none; color: #adadad; font-weight: bold;}
*{
    margin:0 auto; /*좌우 바깥 여백을 자동할당 시켜서 중앙 정렬로*/
    padding: 0; /* 안쪽 여백 없도록 설정*/
    list-style: none; /* 목록태그(ul, li, ol)의 기본스타일 아무것도 없는것으로 설정*/
    font-family: "NanumSquare"; /*글꼴*/
    box-sizing: border-box;
    -webkit-box-sizing:border-box;
    -moz-box-sizint:border-box;
    font-size: 62.5%;
}
p{
    background-color: inherit;
}
html,body {width:100%;height:100%;margin:0px;padding:0px;font-family:sans-serif;}

.fullsection{width:100%;height:100%;position:relative;}
.center_align{
    text-align: center;
    display: block;
    width: 700px;
}
.margin20{
    margin: 10px 0px 0px 0px;
    padding-right: 20px;
    padding-left: 20px;
}
input[type="text"]:focus{outline:1px solid gray;}

.button2 {
	display: inline-block;
	zoom: 1; /* zoom and *display = ie7 hack for display:inline-block */
	*display: inline;
	vertical-align: baseline;
	width: 200px;
	height: 50px;
	margin: 5px 2px;
	outline: none;
	cursor: pointer;
	text-align: center;
	text-decoration: none;
    font-style: bold;
	font: 22px/100% 'NanumSquare' ;
	padding: .5em 2em .40em;
	text-shadow: 0 1px 1px rgba(0,0,0,.3);
	-webkit-border-radius: .5em;
	-moz-border-radius: .5em;
	border-radius: .5em;
	-webkit-box-shadow: 0 1px 2px rgba(0,0,0,.2);
	-moz-box-shadow: 0 1px 2px rgba(0,0,0,.2);
	box-shadow: 0 1px 2px rgba(0,0,0,.2);
}
.button2:hover {
	text-decoration: none;
}
.button2:active {
	position: relative;
	top: 1px;
}

.gray {
	color: #e9e9e9;
	border: solid 1px #555;
	background: #6e6e6e;
	background: -webkit-gradient(linear, left top, left bottom, from(#888), to(#575757));
	background: -moz-linear-gradient(top,  #888,  #575757);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#888888', endColorstr='#575757');
}
.gray:hover {
	background: #616161;
	background: -webkit-gradient(linear, left top, left bottom, from(#757575), to(#4b4b4b));
	background: -moz-linear-gradient(top,  #757575,  #4b4b4b);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#757575', endColorstr='#4b4b4b');
}
.gray:active {
	color: #afafaf;
	background: -webkit-gradient(linear, left top, left bottom, from(#575757), to(#888));
	background: -moz-linear-gradient(top,  #575757,  #888);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#575757', endColorstr='#888888');
}
.red {
	color: #e9e9e9;
	border: solid 1px #555;
	background: #6e6e6e;
	background: -webkit-gradient(linear, left top, left bottom, from(#888), to(#575757));
	background: -moz-linear-gradient(top,  #888,  #575757);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#888888', endColorstr='#575757');
}
.red:hover {
	background: #df0404;
	background: -webkit-gradient(linear, left top, left bottom, from(#757575), to(#4b4b4b));
	background: -moz-linear-gradient(top,  #757575,  #4b4b4b);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#757575', endColorstr='#4b4b4b');
}
.red:active {
	color: #ff0000;
	background: -webkit-gradient(linear, left top, left bottom, from(#575757), to(#888));
	background: -moz-linear-gradient(top,  #575757,  #888);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#575757', endColorstr='#888888');
}

/*--------------index.php----------------*/
#ind{
    width:100%;height:100%;margin:0px;padding:0px;font-family:sans-serif;overflow: hidden;
}
#fullpage{position:relative;top:0px;z-index:9;width:100%;height:100%;}
.full1{background:white;}
.full2{background:#4a8eff;}
.full3{background:#36cb64;}
.full4{background:#ffffff;}
.full5{background:purple;}
#fullpage span{display:block;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);color:#fff;font-size:4rem;font-weight:bold;text-align: center;}
.full2 span{color:#000;}
.full5>.bottom{width: 100%;position:absolute;bottom:0;height: 150px;}

.index_icon1{
	text-align: center;
    color: steelblue;
    font-weight: 700;
}

/* 노란색 라운딩 작은박스 */
.yellow_round_box_index{
    background: #FEC900;
    margin-top: 30px;
	  width: 500px;
    height: 60px;
    line-height: 60px; /*안에서 위아래 가운데 정렬됨*/
    border-radius: 10px;
    text-align: center;
    position: sticky;
    bottom: 0;
    margin-bottom: 50px;
    color: #00162B;
    font-size: 3rem;
    font-weight: 900;
    letter-spacing: -2px;
	font-family:'NanumSquareRound' ;
}
.txt_navy_big{
    color: #00162B;
    font-weight: 900;
    font-size: 14rem;
    line-height: 80px;
    margin-bottom: 30px;
    letter-spacing: -10px;
	font-family:'NanumSquareRound' ;
}
.txt_navy_big2{
    color: #00162B;
    font-weight: 700;
    font-size: 8.5rem;
    line-height: 80px;
    letter-spacing: -5px;
	font-family:'NanumSquareRound' ;
}
.txt1_st{
    text-align: center;
    color: #ffffff;
    font-size: 33px;
    font-weight: 700;
}
.txt2_st{
    text-align: center;
    color: #ffffff;
    font-weight: 900;
    font-size: 60px;
	font-family:'NanumSquareRound' ;
}
.txt2_st_blk{
    text-align: center;
    color: #000000;
    font-weight: 900;
    font-size: 60px;
	font-family:'NanumSquareRound' ;
}
.txt3_st{
    text-align: center;
    color: #ffffff;
    font-weight: 900;
    font-size: 150px;
	font-family:'NanumSquareRound' ;
}
.yellow_round_box1_st{
    background: #FEC900;
    margin-top: 20px;
    width: 500px;
    height: 60px;
    line-height: 60px; /*안에서 위아래 가운데 정렬됨*/
    border-radius: 10px;
    text-align: center;
    bottom: 0;
    margin-bottom: 20px;
    color: #00162B;
    font-size: 30px;
    font-weight: 900;
    letter-spacing: -2px;
	font-family:'NanumSquareRound' ;
}
.yellow_round_box2_st{
    background: #FEC900;
    margin-top: 20px;
    width: 500px;
    height: 20px;
    line-height: 60px; /*안에서 위아래 가운데 정렬됨*/
    border-radius: 10px;
    text-align: center;
    bottom: 0;
    margin-bottom: 20px;
    color: #00162B;
    font-size: 30px;
    font-weight: 900;
    letter-spacing: -2px;
}	
.blue_round_box_st{
    background: goldenrod;
    width: 150px;
    height: 150px;
    line-height: 150px; /*안에서 위아래 가운데 정렬됨*/
    border-radius: 75px;
    text-align: center;
    color: white;
    font-size: 5rem;
    font-weight: 900;
    letter-spacing: -1px;
	font-family:'NanumSquareRound' ;
}
.blue_round_box_st:hover{
    cursor: pointer;
    opacity: 70%;
    font-size: 5rem;
}

ul, li{margin:0;padding:0;list-style:none}
.quick {position:fixed;right:20px;top:50%;transform:translateY(-50%); z-index:100000}
.quick li {width:10px;height:10px;margin-bottom:10px; border-radius:15px;border:2px solid #EAEAEA;background:#EAEAEA;cursor:pointer;}
.quick .on {width:10px;height:30px;margin-bottom:10px; border-radius:15px;border:2px solid #8C8C8C;background:#8C8C8C;}

#fixed_layer
{
    position:fixed;
    transform:translateY(-50%);
    z-index:1000;
    height:50px;
    width:50px;
    top:20%;
    right:300px;
}
#fixed_layer_tpdn
{
    position:fixed;
    transform:translateY(-50%);
    z-index:2000;
    height:20px;
    width:100px;
    top:38%;
    right:10px;
	display: block; /* 처음에는 숨김 */
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.3s ease-in-out, visibility 0.3s ease-in-out;	
}
.tpdn_round_box{
	background: #E82561;
	width: 35px;
	height: 35px;
	padding-top: 3px;
	margin-top: 5px;
	line-height: 25px; /*안에서 위아래 가운데 정렬됨*/
	border-radius: 10px;
	text-align: center;
	color: white;
	font-size: 35px;
	font-weight: 900;
	letter-spacing: -1px;
	font-family:'NanumSquareRound' ;
	opacity: 30%;
}
.tpdn_round_box:hover{
	cursor: pointer;		
	opacity: 10%;
	font-size: 25px;
}
.tpdn_round_box2{
	width: 100px;
	height: 70px;
	padding-top: 3px;
	margin-bottom: 6px;
	margin-right: 100px;
	line-height: 25px; /*안에서 위아래 가운데 정렬됨*/
	border-radius: 0px;
	text-align: center;
	color: #AA60C8;
	font-size: 100px;
	font-weight: 900;
	letter-spacing: -1px;
	font-family:'NanumSquareRound' ;
	text-shadow: 0 0px 0 #fff,
				   0 1px 0 #fff,
				   0 2px 0 #fff,
				   0 2px 0 #fff,
				   0 4px 0px rgba(0, 0, 0, .1),
				   0 5px 0 transparent,
				   0 6px 0 transparent,
				   0 7px 0 transparent,
				   0 8px 0 transparent,
				   0 9px 10px rgba(0, 0, 0, .4);		
	
	opacity: 0; /* 처음에는 투명 */
    transition: opacity 0.2s ease-out;
    /* 👻 부드럽게 위아래로 움직이는 애니메이션 추가 */
    animation: ghostFloat 1.0s ease-in-out infinite alternate;
}

/* 📌 위아래로 5px씩 움직이는 애니메이션 */
@keyframes ghostFloat {
    0% {
        transform: translateY(0);
    }
    100% {
        transform: translateY(-15px);
    }
}
/*quiz_head_info_no*/

.title_box_no{
    bottom: 0;
    float: left;
    height: 100%;
}
.title_box_no>img{
  height: 60%;
  margin-left: 20px;
}
.title_box_no:hover{
    cursor: pointer;
    opacity: 70%;
    font-size: 30px;
}
/*-----------------quiz_head_info_no-------------------------*/
.header_login_short{
    height: auto;
    float: right;
    width: 900px;
    position: absolute;
    margin-top: 40px;
}
.hd_login_short li {float:right;margin:0 15px;border-left:1px solid #616161;padding-left:20px;line-height:13px;font-size: 3rem;}

body.qhead_info_no{
    height: 8%;
    width: 100%;
    margin:0 auto; /*좌우 바깥 여백을 자동할당 시켜서 중앙 정렬로*/
    background-color: #073b4c;
  }
  .qhead_no_inner{ /* 맨 상단 */
      background-color: #073B4C;
      width: 100%;
      color: rgba(255,255,255,0.8); /*글씨색 80%투명도*/
      text-align: center;
      font-size: 25px;
      height: 80px;
      line-height: 80px;
      width: 100%;
  }
 
/*----------------quiz_head----------------------------*/
body.qhead{
	height: 100%;
    width: 100%;
    margin:0 auto; /*좌우 바깥 여백을 자동할당 시켜서 중앙 정렬로*/
    background-color: inherit;
}
.qhead_header{ /* 맨 상단 */
    background-color: #073B4C;
    width: 100%;
    color: rgba(255,255,255,0.8); /*글씨색 80%투명도*/
    text-align: center;
    font-size: 25px;
    height: 135px;
    line-height: 133px;
    width: 100%;
    box-shadow: 0px 10px 10px lightgray;
}
.header_div{
    width: 1100px;
    float: center;
    background-color: #041225;
}
.header_div>img{
    position: relative;top: 30px;
    background-color: inherit;
    width: 90px;
    float: left;
}
.header_div>img:hover{
    opacity: 60%;
    cursor: pointer;
}
#header_div{padding-top: 10px;}
#main{
   text-align: center;
    min-height: 100%;
    margin-top: 30px;
    width: 100%;
    position: relative;
    font-family: "굴림"; /*글꼴*/
}
.txt_navy_boxs{
  min-height: 100%;
}
.txt_navy{
    color: #00162B;
    font-size: 38px;
    line-height: 50px;
    font-weight: 600;
}
.txt_info{
    width: 100%;
    height: 100%;
    margin-bottom: 50px;
}
.txt_navy_small{
    color: #8C8C8C;
    font-size: 30px;
    line-height: 50px;
    font-weight: 600;
      height: 100%;
}
.txt_navy_bold2{
    color: #00162B;
    font-weight: 900;
    font-size: 39px;
    line-height: 50px;
}
/* 노란색 라운딩 작은박스 */
.yellow_round_box{
    background: #FEC900;
    margin-top: 30px;
	  width: 500px;
    height: 60px;
    line-height: 60px; /*안에서 위아래 가운데 정렬됨*/
    border-radius: 10px;
    text-align: center;
    position: sticky;
    bottom: 0;
    margin-bottom: 50px;
    color: #00162B;
    font-size: 30px;
    font-weight: 900;
    letter-spacing: -2px;
}
.txt_highlight_big{
  font-weight: 900;
  font-size: 80px;
}
/* 파란색 항상표시 라운드박스부분 */
.title{
  height: 130px;
  width: 900px; /*전체 가로에서 가운데정렬*/
  text-align: left;
  bottom: 0;
  color: white;
}

.title_box{
  bottom: 0;
  float: left;
}

.title_box>img{
  width: 140px;
  height: 108px;
}
.title_box:hover{
  cursor: pointer;
  opacity: 70%;
  font-size: 60px;
}
.header_login{
    height: auto;
    float: right;
    width: 900px;
    position: absolute;
    margin-top: 60px;
}

.hd_login{height:100%;width:100%;position:absolute;float: right;line-height: 1.5;}
.hd_login li {float:right;margin:0 15px;border-left:1px solid #616161;padding-left:20px;line-height:4.2rem;font-size: 4rem;}
#fcolor1{color: yellow;}

.hd_login li a:after{
    content: "";
    position: absolute;
    left: 0;
    bottom: -5px;
    width: 0px;
    height: 2px;
    margin: 5px 0 0;
    transition: all 0.2s ease-in-out;
    transition-duration: 0.3s;
    opacity: 0;
    background: #ffb000;
  }
  .hd_login li a:hover:after{
    width: 100%;
    opacity: 1;
  }

.hd_login li a{text-decoration: none;
    position: relative;}

.hd_login li:first-child {border-left:0}
.hd_login a {color:#fff}

/* 파란색 항상표시 라운드박스부분 */
.blue_rb{
  padding: 5px 30px;
 border: 1px solid lightgray;
 border-radius: 4px;
 -webkit-box-shadow: inset 1px 6px 12px #678ac7, inset -1px -10px 5px #26598e, 1px 2px 1px lightgray;
 -moz-box-shadow: inset 1px 6px 12px #678ac7, inset -1px -10px 5px #26598e, 1px 2px 1px lightgray;
 box-shadow: inset 1px 6px 12px #678ac7, inset -1px -10px 5px #26598e, 1px 2px 1px lightgray;
 background-color: #2b70b8;
 color: white;
 text-shadow: 1px 1px 1px lightgray;
 margin-top: 1px; width: 450px;
 height: 80px;
 border-radius: 40px;
 color: white;
 font-size: 45px;
 font-weight: 900;
 letter-spacing: -1px;
 line-height: 80px; /*안에서 위아래 가운데 정렬됨*/
}
.blue_round_box{
    background: #2485FF;
    margin-top: 1px; width: 550px;
    height: 100px;
    line-height: 100px; /*안에서 위아래 가운데 정렬됨*/
    border-radius: 50px;
    text-align: center;
    position: sticky;
    box-shadow: 15px 15px 13px lightgray;
    bottom: 0;
    margin-bottom: 30px;
    color: white;
    font-size: 45px;
    font-weight: 900;
    letter-spacing: -1px;
}
.blue_round_box:hover{
    cursor: pointer;
    opacity: 70%;
    font-size: 55px;
}
.txt_white_bold{
    color: white;
    height: 90px;
    background-color: inherit;
    font-size: 53px;
    text-align: center;
    line-height: 133px; /*100px안에서 위아래 가운데 정렬됨*/
    letter-spacing: -1px;
    font-weight: 900;
}
.txt_navy_bold{
    color: #00162B;
    font-weight: 900;
    font-size: 50px;
    background-color: inherit;
}
footer.index{
  position: absolute;
    bottom: 0;
    height: 100%;
    width: 100%; /*전체 가로에서 가운데정렬*/
    background: rgba(0,0,0,0);
    z-index: 1;
    margin-bottom: 30px;
}

.centered {position: absolute;left: 50%;top: 50%;margin-right: -50%;transform: translate(-50%, -50%);
    text-align: center;}

.bg {
  position: absolute;top: 0;width: 0;z-index: -2;height: 100%;background: #fff;padding-bottom: 5px;
  box-shadow: 10px 10px 0 0 #E06969;transition: width 0.3s ease;
}

.centered>input[type="checkbox"] {
  position: absolute;opacity: 0;width: 100%; height: 100%; cursor: pointer;}

.centered>input[type="checkbox"] + label {
  padding-left: 30px; text-shadow: 1px 1px 0 #E06969;
  color: white; transition: color 0.3s ease;}

.centered>input[type="checkbox"]:checked + label {color: #E06969;}

.centered>input[type="checkbox"]:checked ~ .bg {width: 100%;}

.centered>input[type="checkbox"]:checked ~ .bg:hover {box-shadow: 3px 3px 0 0 green;}

.centered>input[type="checkbox"] + label .qmark {
  opacity: 1;transition: opacity 0.2s ease;font-size: 6rem;}

.centered>input[type="checkbox"]:checked + label .qmark {
  opacity: 0;font-size: 6rem;}

.centered>input[type="checkbox"] + label .fstop {
  opacity: 0;position: relative;left: -20px;transition: opacity 0.2s ease;font-size: 6rem;}

.centered>input[type="checkbox"]:checked + label .fstop {
  opacity: 1; color: #E06969;
  margin-left: -60%;font-size: 6rem;
  transform: translate(-50%, -50%);}

/*----------------quiz_page-------------------------------*/
#qmenu_qpage{
    background-color: #949aadd0;
    min-height: 100%;
    width: 100%;
    position: relative;
    top: 0px;
    left: 0px;
    z-index: 1;
}
#back_qpage_div1{ max-width: 1500px;padding: 50px;}
#allsc{display: none;}
.back_qpage_div2{width: 1100px;
        background-color: white;border-radius: 30px;
        border:solid 1px #C0C0C0;
        padding-bottom:120px ;margin-top: 40px;}
#back_qpage_st{
    height: 100%;    width: 860px;
    background-color: #FFB097;z-index: -1;position: absolute;
}

#back_qpage_st{
    background-color: #FFB097;
    position: absolute;
    width: 100%;
    top: 0px;
    left:0px;
    height: 100%;
    align-items: center;
    justify-content: center;
    display: flex;
    z-index: 1;
}
.yellow_round_box_qpage_st{
    background: #FEC900;
	margin-top: 180px;
    width: 270px;
	display:block;
    border-radius: 15px;
	height:50px;
    line-height: 50px;/*height높이와 같게하면 위아래로 꽉차서 세로가운데정렬 정상작동함*/
    text-align: center;
    color: #00162B;/*navy*/
    font-size: 28px;
    font-weight: 900;
    box-shadow: 2px 2px 2px rgba(0,0,0,10%);
}
.yellow_round_box_qpage_st:hover{ /* input 태그 중 type='text'인 것만 선택*/
    cursor: pointer;
    opacity: 70%;
    font-size: 35px;	
}
.back_qpage1{
	text-align: center;
    position: relative;
    height: 100%;
    width: 100%;
    background:purple;
}
.back_qpage4{
    width: 300px;
    color: #F6AE2D;
    font-size: 1rem;
    text-align: center;
    border-radius: 5px;
    margin-top: -95px;
    align-items: center;
    height: 100px;
}
.iheader{
    width: 13px;
    height:8px;
    border-start-start-radius: 3px; 
    border-start-end-radius: 3px;
    background-color: whitesmoke;
}
.ishape{
    display:inline-block;
    z-index:2;
    position: relative;
    margin-bottom: 5px;
    margin-top: -50px;
}
.ishape>i{
    background-color: #E6557A;
    color: white;
    padding: 7px;
    border-radius: 13px;
}

.rounded_box_top3 {
	display: inline-block;
	font-style: bold;font: 2.5rem/100% 'NanumSquare';font-weight:700;
	text-align:center;height: 80px;  line-height: 80px;
    padding-left: 80px;padding-right: 80px;
      background-color:white;	opacity:1;
    border-end-start-radius: 13px;  border-end-end-radius: 13px;
    color: grey;
    z-index:1;
    position: relative;
    padding-top: 13px;
    margin-top: -30px;
    box-shadow: 1px 2px 2px rgba(0,0,0,30%);
}
#quiz_center{
    display: inline-block;
    width: 100%;
    height: 100%;
}
.back_qpage2{
	width: 1000px;
    margin: 0 auto;
    height: 40%;
    margin-top: 20px;
	position: relative; /* 자식 요소의 기준 위치 설정 */
}
.back_qpage3_2{
    height: 50px;
    position: relative;
    width: 1000px;
    text-align: center;
    margin-top: 20px;
}
.back_qpage2_2_1{
    height:70px;
    position: relative;
    margin: 0 auto;
    width: 1000px;
}
.back_qpage2_2_2{
    height: 39px;
    position: relative;
    margin: 0 auto;
    width: 1000px;
}
.qpage_center_btn{
    height: 30px;
    line-height: 30px;
}
.qpage_center_btn>input[type="text"]{
    width: 100%;
    padding: 0px;
    background-color: #e7e7e7;
    border: 1px solid silver;
    margin: 0 auto;
    text-align:center;font-size:17px;
}
.rounded_box_top12 {
	display: inline-block;
	font-style: bold;
	font: 10px/100% 'NanumSquareRound' ;
	font-weight:bold;
	text-align:center;
	vertical-align: middle;
	width: 150px;
	height: 15px;
    background-color:#FFFFFF;
    border:solid 1px #C0C0C0;
	opacity:0.9;
    display:none;
}
.rounded_box_top11 {
	font-style: bold;
	font: 10px/100% 'NanumSquareRound' ;
	font-weight:bold;
	text-align:center;
	vertical-align: middle;		
	width: 130px;
    height: 20px;
    line-height: 20px;
    border:solid 1px #C0C0C0;
	opacity:0.9;
    display:none;
}
.rounded_box_num {
	position: absolute;
	left: 0px;
	top: 0px;
	width: 160px;
	height: 50px;
	background-color: lightslategrey;
	color: white;
	font: 2.2rem/100% 'NanumSquare';
	line-height: 50px;
	font-weight: 800;
	text-align: center;
	border-radius: 5px;
	left: 3px; /* 부모 요소 기준으로 왼쪽 10px 위치 */
	box-shadow: 1px 2px 2px rgba(0,0,0,0.25);
}

.rounded_box_testmode {
	position: absolute;
	right: 0px; /* <-- 이걸로 오른쪽 정렬 */
	top: 25px;
	width: 120px;
	height: 50px;
	background-color: lightslategrey;
	color: white;
	font: 1.0rem/100% 'NanumSquare';
	line-height: 10px;
	font-weight: 800;
	text-align: center;
	border-radius: 5px;
	/* <-- box-shadow: 1px 2px 2px rgba(0,0,0,0.25);*/
	padding-top: 8px;
	margin-top: -25px;
}
.rounded_box_top4 {
	text-align:center;
	height: 50px;
    width: 100%;
    z-index: 2;
    position: absolute;
	background-color: transparent;
	/* <--background-color: #FFE185; */
    margin-top: -112px;
}

.rounded_box_top2 {
	display: inline-block;
	font-size: 2rem;
	font-weight:600;
	text-align:center;
	width: 100%;
    padding: 2%;
	height:110%;
	line-height: 110%;
    border-radius: 5px;
    background-color: #1E3A47;
    color: white;
    box-shadow: 1px 2px 1px rgba(0, 0, 0, 0.1);
}
.rounded_quiz_print {
	display: inline-block;
	overflow: auto;
	font-style: bold;
	font: 28px/100% 'NanumSquare' ;
	font-weight:700;
	text-align:center;
	display: table-cell;
	vertical-align: middle;
	width: 1000px;
	height: 450px;
    max-height: 450px;
    border:solid 1px #C0C0C0;
    margin-top: 10px;
	padding:2rem;
	line-height: 1.5;
	border-radius:2rem;
	-moz-border-radius: 2rem;
	-webkit-border-radius: 2rem;
    background-color: #FFE185;
}

.rounded_quiz_print::-webkit-scrollbar{
    margin-top: 30px;
    margin-bottom: 10px;
    height: 100px;
    width: 5px;
}
.rounded_quiz_print::-webkit-scrollbar-track{
    margin-top: 30px;
    margin-bottom: 10px;
    box-shadow: inset 0px 0px 3px white;
    border-radius: 3px;
    background-color: rgb(162, 162, 162);
}

.rounded_quiz_print::-webkit-scrollbar-thumb{
    background-color: #747474;
    border-radius: 5px;
    background-clip: padding-box;
    border: 1px solid transparent;
}
.rounded_box_dap1 {
	overflow: auto;
	font-style: bold;
	font: 24px/100% 'NanumSquare' ;
	font-weight:900;
	text-align:center;
	width: 1000px;
	height: 50px;
	color:#045FB4;
    background-color:#F6F6F6;
    border:solid 1px #C0C0C0;
	padding-top: 13px;
	margin-top: 10px;
	line-height: 23px;
	border-radius:5px;
	-moz-border-radius: 0.5em;
	-webkit-border-radius: 0.5em;
}
.rounded_box_dap2 {
	overflow: auto;
	font: 20px/100% 'NanumSquare' ;
	font-weight:600;
	text-align:center;
	width: 1000px;
	height: 80px;
	color:#045FB4;
    background-color:#F6F6F6;
    border:solid 1px #C0C0C0;
	padding-top: 5px;
	margin-top: 10px;
	line-height: 25px;
	border-radius:5px;
	-moz-border-radius: 0.5em;
	-webkit-border-radius: 0.5em;
}
.rounded_box_dap3 {
	overflow: auto;
	font-style: bold;
	font: 24px/100% 'NanumSquare' ;
	font-weight:900;
	text-align:center;
	width: 1000px;
	height: 50px;
	color:#045FB4;
    background-color:#fde2ec;
    border:solid 1px #C0C0C0;
	padding-top: 13px;
	margin-top: 10px;
	line-height: 23px;
	border-radius:5px;
	-moz-border-radius: 0.5em;
	-webkit-border-radius: 0.5em;	
}
.rounded_box_dap1::-webkit-scrollbar,
.rounded_box_dap2::-webkit-scrollbar,
.rounded_box_dap3::-webkit-scrollbar{
    width: 5px;
}
.rounded_box_dap1::-webkit-scrollbar-track,
.rounded_box_dap2::-webkit-scrollbar-track,
.rounded_box_dap3::-webkit-scrollbar-track{
    box-shadow: inset 0px 0px 3px white;
    border-radius: 3px;
    background-color: rgb(162, 162, 162);
}
.rounded_box_dap1::-webkit-scrollbar-thumb,
.rounded_box_dap2::-webkit-scrollbar-thumb,
.rounded_box_dap3::-webkit-scrollbar-thumb{
    background-color: #747474;
    border-radius: 5px;
    background-clip: padding-box;
    border: 1px solid transparent;
}
.qpage_buttons{
    height: 100px;
    width: 100%;
	text-align: center;
    margin-top: 70px;
}
.quiz_center{
    position: absolute;
    bottom:0px;
    left: 0px;
    width: 100%;
	text-align: center;
}
.back_qpage2_3{
    position: relative;
    margin-top: 30px;
    width: 100%;
	text-align: center;
    height: 50px;
}
.rb2_wrap{
    display: inline-block;
    width: auto;
    height: 10%;line-height: 10%; 
	margin-top: 60px;
    text-align: center;
}

#back_qpage3{
    top:0px;
    left: 0px;
    height: 20%;
	text-align: center;
}
.rb3_wrap{
    display: inline-block;
    width: auto;
    margin-top: -5px;
    text-align: center;
}

.rounded_box2 {
      border-radius: 10px;
    width: auto; padding: 20px;
    background-color: lightblue;
    font-size: 1.7rem;
    animation: motion 1.3s linear 0s infinite; margin-top: 0;
    font-weight: 700;
}

.tri{
    position: relative;
    width: 10px;height: 10px;
    border-top:5px solid lightblue;
    border-bottom:5px solid none;
    border-right: 5px solid transparent;
    border-left: 5px solid  transparent;
  }        
@keyframes motion {
	0% {margin-top: 0px;}
	20% {margin-top: 3px;}
	40% {margin-top: 0px;}
	60% {margin-top: 3px;}
	80% {margin-top: 0px;}
	100% {margin-top: 0px;}
}
.yellow_small_box_quiz1{  
    display: inline-block;
    width: 20%;
    height: 70%;
    text-align: center;
    color: #774a60;
	font-size: 15px;
    font-weight: 900;
    margin: 10px;
    padding: 7px;
    border-radius: 7px;
    background-color: #fadde1;
    letter-spacing: -1px;
    align-items: inherit;
    line-height: 1.2;

}
.yellow_small_box_quiz_end1{  
    display: inline-block;
    width: 20%;
    height: 70%;
    text-align: center;
    color: white;
	font-size: 15px;
    font-weight: 900;
    margin: 10px;
    padding: 7px;
    border-radius: 7px;
    background-color: #EF476F;
    letter-spacing: -1px;
    align-items: inherit;
    line-height: 1.2;
    top: 0%;
}
.yellow_small_box_quiz_end1:hover {
    background-color: #EF476F;
    box-shadow: 0px 0px 0px rgba(0, 0, 0, 0.1);
    color: #fff;
    transform: translateY(-7px);
    }  

.qpage_buttons2{
    height: 100px;
    width: 100%;
    text-align: center;
}
.pink_small_box_quiz_end1{  
    width: 280px;
    height: 55px;
    line-height: 55px;
    font-style: bold;
	font-size: 22px;
    font-family:'NanumSquare' ;
    text-transform: uppercase;
    letter-spacing: -1px;
    font-weight: 550;
    color: white;
    background-color: #EF476F;
    border: none;
    border-radius: 45px;
    box-shadow: 0px 8px 15px rgba(252, 187, 212, 0.5);
    transition: all 0.3s ease 0s;
    cursor: pointer;
    outline: none;
    align-items: center;
    text-align: center;
    margin-top:10px;
    margin-bottom:30px;
}
.pink_small_box_quiz_end1:before{  

    -webkit-transform: scaleX(.3);
    transform: scaleX(.3);
    background-color: #b32849;
    opacity: 0;
    transition: all .3s
}
.center{margin:0 auto;}
.rounded_box3 {
	overflow: auto;
	font-style: bold;
	font: 10px/100% 'NanumSquareRound' ;
	color:#8C8C8C;
	font-weight:bold;
	text-align:center;
	width: 100%;
	height: 30px;
    line-height: 1.5;
	padding-top: 2px;
    background-color:#F6F6F6;
    border:solid 2px #EAEAEA;
    position: relative;
    font-size: 1.5rem;
}
.red_small_box_quiz1{  
    display: inline-block;
    background: #FF0000;
    width: 150px;
    height: 30px;
    line-height: 30px;/*height높이와 같게하면 위아래로 꽉차서 세로가운데정렬 정상작동함*/
    text-align: center;
    color: #FFFFFF;
	font-size: 12px;
    font-weight: 900;
    margin: 2px;
	margin-top: 5px;
    border:solid 1px #EAEAEA;
    border-radius: 5px;
    display:none;
}
.center_align4{margin-top: 20px;height: 50px; margin-bottom: 1px;}
.center_align4>input[type="text"]{
    text-align:center;
	width: 100%;
	height: 45px;
    font-size:20px;
    background-color:#FAF4C0;
	outline:none;
    padding: 2px;
    margin: 10px;
    display: table-cell;
    vertical-align: middle;			
    font-family:'NanumSquareRound';
    font-weight:bold;
    line-height:150%;
    margin: 0 auto;
	border:solid 1px #BDBDBD;
}

/*------------------------------------*/
#back{
    background-color:white;
    width: 750px;
    border-radius: 20px;
    padding: 15px;
	text-align:center;
	padding-left: 45px;
}
.mode{
    float: left;
    width: 200px;
}

.dap_input{
    font-size: 20px;
}

#info{
    padding: 20px;
}
/*---quiz_st 학습하기 결과보기---------------------------------------------------*/

/* id속성은 class 보다 더 우선적으로 적용됩니다.
회색 테두리만 적용된 box 클래스 위에 보라색 상단 테두리를 제일 앞으로 나오게 하기 위해 id속성에서 작성하였습니다.*/
body.qst{
    width: 100%;
    margin:0 auto; /*좌우 바깥 여백을 자동할당 시켜서 중앙 정렬로*/
}
#main_content{
   min-height: 600px;
   text-align: center;
   margin-top: 30px;
   width: 900px;
}
.txt_login_box{
    height: 270px;
    font-size:3rem;
}
.txt_login_main{
    font-size: 7rem;
    font-weight: 800;
    letter-spacing: -1px;
}
.txt_login_bluebox{
    font-size: 2.7rem;
    background-color: #D6E3F2;
    padding: 5px;
    width: 550px;
    font-weight: 600;
    line-height: 50px;
    letter-spacing: -1px;
}

.txt_login{
    text-align: center;
    margin-left: 30px;
    margin-right: 30px;
    margin-top: 20px;
    font-size: 2.5rem;
    padding: 5px;
    font-weight: 600;
    letter-spacing: -1px;
}

.yellow_lighting{
    background-color: yellow;
    font-size: 3rem;
}
.blue_lighting{
    background-color: blue;
    color: white;
    font-weight: 400;
    font-size: 3rem;
}

.font_force_little{
    font-size: 3.3rem;
    font-weight: 600;
    letter-spacing: -1px;
}
.font_force{
    font-size: 4rem;
    font-weight: 600;
    letter-spacing: -1px;
}
/* 노란색 라운딩 작은박스 */
.yellow_round_box_st1{
    background: #FEC900;
    margin-top: 35px; width: 500px;
	display:block;
    border-radius: 40px;
    height: 70px;
    line-height: 70px;/*height높이와 같게하면 위아래로 꽉차서 세로가운데정렬 정상작동함*/
    text-align: center;
    margin-bottom: 35px;
    color: #353535;/*navy*/
    font-size: 26px;
    font-weight: 900;
    box-shadow: 11px 11px 10px rgba(0,0,0,30%);
}
.blue_round_box_st1{
    background: #118AB2;
    margin-top: 35px; width: 500px;
	display:block;
    border-radius: 40px;
    height: 70px;
    line-height: 70px;/*height높이와 같게하면 위아래로 꽉차서 세로가운데정렬 정상작동함*/
    text-align: center;
    margin-bottom: 35px;
    color: white;/*navy*/
    font-size: 24px;
    font-weight: 900;
    box-shadow: 11px 11px 10px rgba(0,0,0,30%);
}
.green_round_box_st1{
    background: #06d6a0;
    margin-top: 35px; width: 500px;
	display:block;
    border-radius: 40px;
    height: 70px;
    line-height: 70px;/*height높이와 같게하면 위아래로 꽉차서 세로가운데정렬 정상작동함*/
    text-align: center;
    margin-bottom: 35px;
    color: white;/*navy*/
    font-size: 24px;
    font-weight: 900;
    box-shadow: 11px 11px 10px rgba(0,0,0,30%);
}
.blue_round_box_st1:hover,.yellow_round_box_st1:hover,.gray_round_box_st1:hover,.green_round_box_st1:hover,.red_round_box_st1:hover{
    opacity: 50%;
    cursor: pointer;
    font-size: 27px;
}
.gray_round_box_st1{
    background: lightgray;
    margin-top: 35px; width: 500px;
	display:block;
    border-radius: 40px;
    height: 70px;
    line-height: 70px;
    text-align: center;
    margin-bottom: 35px;
    color: #00162B;/*navy*/
    font-size: 28px;
    font-weight: 900;
    box-shadow: 11px 11px 10px rgba(0,0,0,30%);
}
.red_round_box_st1{
	color: white;
    background: #EF476F;
    margin-top: 35px; width: 500px;
	display:block;
    border-radius: 40px;
    height: 70px;
    line-height: 70px;
    text-align: center;
    margin-bottom: 35px;
    /*color: #00162B;navy*/
    font-size: 28px;
    font-weight: 900;
    box-shadow: 11px 11px 10px rgba(0,0,0,30%);
}
.txt_navy_st{
	text-align: center;
    color: #00162B;
    font-size: 33px;
    font-weight: 700;
    width: 550px;
    min-height: 46px;
    height: 46px;
}


/*---quiz_sel_menu1,1_2 문제대표목록---------------------------------------------------*/
body.qmenu1{
    width: 100%;
    margin:0 auto; /*좌우 바깥 여백을 자동할당 시켜서 중앙 정렬로*/
    min-height: 100%;
	display: block;
}

#main_qmenu{
    /*min-height: 900px;*/
	display: block;
	text-align: center;
	width: 100%;
}

.yellow_small_box_menu1{
    position: relative;
    background: #FEC900;
    margin-top: 15px;
    width: 500px;
    border-radius: 35px;
    height: 60px;
    line-height: 60px;/*height높이와 같게하면 위아래로 꽉차서 세로가운데정렬 정상작동함*/
    text-align: center;
    margin-bottom: 15px;
    color: #00162B;
    font-weight: 900;
    float: left;
    box-shadow: 11px 11px 10px rgba(0,0,0,30%);
}
.yellow_small_box_menu1_2{  /*menu1과의 차이는 marin-top차이 class 두개가 가능한지 고민하자*/
   position: relative;
    background: #FEC900;
    margin-top: 15px;
    width: 500px;
    border-radius: 30px;
    height: 60px;
    line-height: 60px;/*height높이와 같게하면 위아래로 꽉차서 세로가운데정렬 정상작동함*/
    text-align: center;
    margin-bottom: 15px;
    color: #00162B;
    font-weight: 900;
    float: left;
    box-shadow: 11px 11px 10px rgba(0,0,0,30%);
}
.top_title1{
    background: #FFD166;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;  
    box-sizing: border-box; 
	height: 50px;
    margin-bottom: 7px;
	line-height: 50px;/*height높이와 같게하면 위아래로 꽉차서 세로가운데정렬 정상작동함*/
	font-weight: 900;
    font-size: 2.2rem;
    float: center;
    margin-bottom: 3rem;
    box-shadow: 2px 2px 2px lightgray;
}
.menu_title2{
    font-size: 22px;
    float: center;
}

#content>input:hover{
    cursor: pointer;
}
.menu_title1{
    font-size: 25px;
    background-color: #FEC900;
    float: center;
}
.yellow_small_box_menu1>input[type="image"],.yellow_small_box_menu1_2>input[type="image"]{ /* input 태그 중 type='text'인 것만 선택*/
    width: 500px;
    height: 70px;
    outline: 0px;
    position: absolute;
    top: 0px;
    left: 0px;
    text-align: center;
    background-color: rgba(0,0,0,0%);
    opacity: 0%;
}
.yellow_small_box_menu1:hover,.yellow_small_box_menu1_2:hover{ /* input 태그 중 type='text'인 것만 선택*/
    opacity: 50%;
}
#content>input:focus{
    outline: none;
}


/*---quiz_sel_menu2 문제세부목록---------------------------------------------------*/
.table_1_2{ 
	margin: 0 auto;
	text-align: center; max-width: 1300px; display: table;
	width: 100%; 
	background-color: white;
    display: flex;  /* 변경 */
    flex-direction: column; /* 세로 정렬 */
    align-items: center; /* 가로 정렬 (가운데 정렬) */
}
.table{
    display: table;float: left;margin:10px;width: 100%; margin-bottom: 30px;
}
.table_menu2{
    display: table;float: left;width: 100%;margin:0 auto;margin-bottom: 10px;
	background-color: white;
	width: 95%; /* 원하는 너비로 조절 */
    max-width: 1300px; /* 원하는 최대 너비 설정 */
    border-radius: 10px; /* 모서리를 둥글게 */
    overflow: hidden; /* 내부 요소가 둥근 모서리를 넘지 않도록 */		
}
.table_menu2_1{
    display: table;float: left;width: 100%;margin:0 auto;margin-bottom: 10px;
	background-color: #fffbe8;
    width: 95%;  /* 원하는 너비로 조절 */
    max-width: 1300px; /* 원하는 최대 너비 설정 */	
    border-radius: 10px; /* 모서리를 둥글게 */
    overflow: hidden; /* 내부 요소가 둥근 모서리를 넘지 않도록 */	
}
.table_menu2_2{
    display: table;float: left;width: 100%;margin:0 auto;margin-bottom: 10px;
	background-color: #eaf8fc;
    width: 95%;  /* 원하는 너비로 조절 */
    max-width: 1300px; /* 원하는 최대 너비 설정 */	
    border-radius: 10px; /* 모서리를 둥글게 */
    overflow: hidden; /* 내부 요소가 둥근 모서리를 넘지 않도록 */	
}
.row{display:table-row;text-align: center;}
    /*-----------------qmenu1_2_box2(나눈버튼의 왼쪽)----------------------*/
.main_qmenu1_2_box1{   
    background: rgb(102, 88, 88);
    border-end-start-radius: 13px; 
    border-start-start-radius: 13px;
    width: 100%;	
    height: 50px;
    line-height: 50px;/*height높이와 같게하면 위아래로 꽉차서 세로가운데정렬 정상작동함*/
    text-align: center;
    margin-top: 7px; 
    margin-bottom: 3px; 	
    color: #00162B;/*navy*/
    font-size: 1.5rem;
    font-weight: 900;
    padding: 0;
    box-shadow: 1px 2px 2px rgba(0,0,0,20%);
    padding-right: 20px;
}
.main_qmenu1_2_box1>i{
    position: absolute;
    line-height: 50px;
    color: lightgray;
}

    /*-----------------main_qmenu1_2_box2(나눈버튼의 오른쪽)----------------------*/
#table_menu1_2:active .main_qmenu1_2_box2{
 
    color: white;
    
}
.main_qmenu1_2_box2{   
    color: #393939;/*navy*/
    float: left;
    background: white;
    border-end-end-radius: 13px; 
    border-start-end-radius: 13px;
    width: 100%;	
    height: 50px;
    line-height: 50px;/*height높이와 같게하면 위아래로 꽉차서 세로가운데정렬 정상작동함*/
    text-align: center;
    margin-top: 7px; 
    margin-bottom: 3px; 	
    font-size: 1.8rem;
    font-weight: 900;
    box-shadow: 2px 2px 0px rgba(0,0,0,20%);
}
.main_qmenu1_2_box2:hover{
    opacity: 80%;cursor: pointer;box-shadow: 1px 1px 1px rgba(0,0,0,30%);
}
.column1{
    width: 20%;height: 100%;float: left;}
.column2{
    width: 80%;height: 100%;float: left;padding-left: 1px;}

/*---quiz_sel_menu2 문제세부목록---------------------------------------------------*/

body.qmenu2{
    width: 100%;
    margin:0 auto; /*좌우 바깥 여백을 자동할당 시켜서 중앙 정렬로*/
    /*min-height: 100%;*/
	display: block;
}

#main_qmenu2{
    position:relative;
    bottom: 0;
    min-height: 60%;
    text-align: center;
    width: 100%;
    padding: 0 0 10px 0;
}
#select_box{display: inline-block;}
.txt_box_title{
    line-height: 1.3;
    margin-bottom: 0.5em;
    float: left;
    color: #000;
    font-weight: 800;
    font-size: 2.5rem;
}
.txt_box{
    line-height: 1.3;
    margin-bottom: 0.5em;
    text-align: left;
}
.cell{display: table-cell;
    padding: 3px; border-bottom: 1px solid #DDD; width: 250px;height
    :40px;line-height:40px;float: left;margin-bottom: 25px;
}
.gray_small_box1{
    display: inline-block;
    position: relative;
    background: #D6E4E5;
    width: 195px;
    height: 30px;
    line-height: 30px;/*height높이와 같게하면 위아래로 꽉차서 세로가운데정렬 정상작동함*/
    text-align: center;
    color: #00162B;/*navy*/
    font-weight: 900;
    float: left;
    margin: 5px;
    box-shadow: 3px 3px 3px rgba(0,0,0,30%);
    border-radius: 5px;
}
.gray_small_box12{
    display: inline-block;
    position: relative;
    background: #F5F5F7;
    width: 195px;
    height: 30px;
    line-height: 30px;/*height높이와 같게하면 위아래로 꽉차서 세로가운데정렬 정상작동함*/
    text-align: center;
    color: #00162B;/*navy*/
    font-weight: 900;
    float: left;
    margin: 5px;
    /*box-shadow: 3px 3px 3px rgba(0,0,0,30%);*/
    border-radius: 5px;
}
.yellow_small_box{
    display: inline-block;
    position: relative;
    background: #FEC900;
    width: 195px;
    height: 30px;
    line-height: 30px;/*height높이와 같게하면 위아래로 꽉차서 세로가운데정렬 정상작동함*/
    text-align: center;
    color: #00162B;/*navy*/
    font-weight: 900;
    float: left;
    margin: 5px;
    box-shadow: 3px 3px 3px rgba(0,0,0,30%);
    border-radius: 5px;
}
.blue_small_box{
    display: inline-block;
    position: relative;
    background: #8BBDFF;
    width: 195px;
    height: 30px;
    line-height: 30px;/*height높이와 같게하면 위아래로 꽉차서 세로가운데정렬 정상작동함*/
    text-align: center;
    color: #00162B;/*navy*/
    font-weight: 900;
    float: left;
    margin: 5px;
    box-shadow: 3px 3px 3px rgba(0,0,0,30%);
    border-radius: 5px;
}
.Purple_small_box{
    display: inline-block;
    position: relative;
    background: #FEA1BF;
    width: 195px;
    height: 30px;
    line-height: 30px;/*height높이와 같게하면 위아래로 꽉차서 세로가운데정렬 정상작동함*/
    text-align: center;
    color: #00162B;/*navy*/
    font-weight: 900;
    float: left;
    margin: 5px;
    box-shadow: 3px 3px 3px rgba(0,0,0,30%);
    border-radius: 5px;
}
.qmenu2_top_title1{
    background: #FFD166;
	width: 100%;
	height: 50px;
    margin-bottom: 0px;
	line-height: 50px;/*height높이와 같게하면 위아래로 꽉차서 세로가운데정렬 정상작동함*/
	font-weight: 900;
    font-size: 2rem;
    float: center;
}
.qmenu2_top_title1_2{
	color:#5D5D5D;
	background-color: #FFFFD7;
    box-shadow: 2px 2px 2px lightgray;
	width: 100%;
	height: 50px;
    margin-bottom: 7px;
	line-height: 50px;/*height높이와 같게하면 위아래로 꽉차서 세로가운데정렬 정상작동함*/
	font-weight: 900;
    font-size: 2rem;
    float: center;
}
.sub_title1{
    line-height: 30px;
    margin-top: -0.15em;
	margin-left: 39px;
    float: left;
    /*color: #000;*/
	color: #00162B;
    font-weight: 500;
    font-size: 1.5rem;
}
.sub_title2{
	/*display: inline;
    line-height: 0.9;
    margin-top: -0.2em;
    float: left;*/
	color: #474747;
    font-weight: 700;
    font-size: 1.8rem;
	text-align: center;
	height: 32px;
	/* 새로운 스타일 추가 */
    background-color: #96CEB4; /* 연한 회색 배경 */
    border-radius: 6px; /* 둥근 모서리 */
    padding: 3px 3px; /* 내부 여백 */
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1); /* 부드러운 그림자 */
    display: inline-block; /* 텍스트 크기에 맞게 박스 크기 조정 */	
	min-width: 30px;
	margin-right: 5px;
	margin-top: 3px;
}
.sub_title2_1{
	/*display: inline;
    line-height: 0.9;
    margin-top: -0.2em;
    float: left;*/
	color: #474747;
    font-weight: 700;
    font-size: 1.8rem;
	text-align: center;
	height: 32px;
	/* 새로운 스타일 추가 */
    background-color: #FFD95F; /* 연한 회색 배경 */
    border-radius: 6px; /* 둥근 모서리 */
    padding: 3px 3px; /* 내부 여백 */
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1); /* 부드러운 그림자 */
    display: inline-block; /* 텍스트 크기에 맞게 박스 크기 조정 */	
	min-width: 30px;
	margin-right: 5px;
	margin-top: 3px;
}
.sub_title2_2{
	/*display: inline;
    line-height: 0.9;
    margin-top: -0.2em;
    float: left;*/
	color: #474747;
    font-weight: 700;
    font-size: 1.8rem;
	text-align: center;
	height: 32px;
	/* 새로운 스타일 추가 */
    background-color: #7BD3EA; /* 연한 회색 배경 */
    border-radius: 6px; /* 둥근 모서리 */
    padding: 3px 3px; /* 내부 여백 */
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1); /* 부드러운 그림자 */
    display: inline-block; /* 텍스트 크기에 맞게 박스 크기 조정 */	
	min-width: 30px;
	margin-right: 5px;
	margin-top: 3px;
}
.sub_title3{
    line-height: 26px;
    margin-top: -0.15em;
    float: center;
    /*color: #000;*/
	color: #B7B7B7;
    font-weight: 800;
    font-size: 1.7rem;
}
.title1{
    font-size: 1.8rem;
    /*background-color: #FEC900;*/
    float: center;
}
.txt1{
	text-align: left;
    font-size: 3rem;
	line-height: 30px;
    float: left;
    margin-right: 5px;
    min-width: 300px;
    width: auto;
}
.txt2{
	text-align: left;
    font-size: 1.5rem;
    float: left;
    margin-right: 5px;
    width: auto;
    min-width: 310px;


}
.txt4{
    font-size: 1.5rem;
    float: left;
    height: 20px;
    line-height: 15px;
    width: 180px;
	font-weight: 500;
    /*font-family:'NanumSquare';*/
}
.txt3{/*줄바꿈가능*/
    font-size: 2rem;
    line-height: 17px;
    margin: 12px;
}
.gray_small_box1>input[type="image"]{ /* input 태그 중 type='text'인 것만 선택*/
    width: 180px;
    height: 30px;
    outline: 0px;
    position: absolute;
    top: 0px;
    left: 0px;
    text-align: center;
    background-color: rgba(0,0,0,0%);
    display: hidden;
    margin-right: 10px;
}
.yellow_small_box>input[type="image"]{ /* input 태그 중 type='text'인 것만 선택*/
    width: 180px;
    height: 30px;
    outline: 0px;
    position: absolute;
    top: 0px;
    left: 0px;
    text-align: center;
    background-color: rgba(0,0,0,0%);
    display: hidden;
    margin-right: 10px;
}
.blue_small_box>input[type="image"]{ /* input 태그 중 type='text'인 것만 선택*/
    width: 180px;
    height: 30px;
    outline: 0px;
    position: absolute;
    top: 0px;
    left: 0px;
    text-align: center;
    background-color: rgba(0,0,0,0%);
    display: hidden;
    margin-right: 10px;
}
.Purple_small_box>input[type="image"]{ /* input 태그 중 type='text'인 것만 선택*/
    width: 180px;
    height: 30px;
    outline: 0px;
    position: absolute;
    top: 0px;
    left: 0px;
    text-align: center;
    background-color: rgba(0,0,0,0%);
    display: hidden;
    margin-right: 10px;
}
.cell>input:hover{
    cursor: pointer;
}
.cell>input{
    opacity: 0%;
}
.cell>input:focus{
    outline: none;
}
#content>input:hover{
    cursor: pointer;
}
#content>input{
    opacity: 0%;
}
#content>input:focus{
    outline: none;
}
/*---footer----------------------------------------------------------------------*/
/*
.block{
  position:inline-block;
  bottom: 0;
}*/
.empty-div{
      /*position: fixed; /* 화면에 고정 위치 */
	  display: block;
      bottom: 0;       /* 하단에 배치 */
      left: 0;         /* 왼쪽 끝에 배치 */
      width: 100%;     /* 화면 전체 너비 */
      height: 100px;   /* 높이를 160px로 설정 */
      /* background-color: lightgray; /* 배경색 */
      padding: 20px;   /* 내부 여백 */
      box-sizing: border-box; /* padding 포함하여 크기 설정 */
}
#footer{

}
footer{
    /* position: relative;
    display: inline-block;
   background-color: #01579B;
    background-color: rgb(147, 164, 180);
    width: 100%;
    height: 150px;
    bottom: 0;
    left: 0;*/
	position: fixed; /* 화면에 고정 */
	bottom: 0;       /* 하단에 위치 */
	left: 0;         /* 왼쪽 끝 */
	width: 100%;     /* 화면 전체 너비 */
	height: 90px;   /* 푸터 높이 */
	/* background-color: #333;배경색 */
	background-color: rgb(147, 164, 180);
	color: white;    /* 글자색 */
	display: flex;
	justify-content: center; /* 가로 중앙 정렬 */
	align-items: center;     /* 세로 중앙 정렬 */
	z-index: 1100;   /* 다른 요소 위에 표시 */	
}

form{
     /*min-height: 60%;
    position: relative;
	padding-bottom: 200px;   푸터와 겹치지 않도록 추가 여백 */
}
.bottom{
	float:center;
	height:100%;
	width:1000px;
    background-color: inherit;
}
.copy{
	padding-top:7px;
	float:center;
	height:37px;
	width:700px;
	text-align:center;
	font-size:1.4rem;
	line-height:37px;
    color: white;
    font-weight: 600;
    background-color: inherit;
}
.site{
	float:right;
	height:100px;
	width:300px;
    background-color: inherit;
}
.sns{
	float:right;
	height:50px;
	width:300px;
    background-color: inherit;
    display: none;
}
.sns ul{
	text-align:center;
    background-color: inherit;
}
.sns ul li{
	display:inline-block;
    background-color: inherit;
}
.sns img{
	height:45px;
	width:45x;
	padding:5px;
}
.sns img:hover{
	opacity:0.5;
}
.familysite{
	float:right;
    margin-top: 50px;
	width:300px;
    background-color: inherit;
}
.familysite select{
	float:right;
	height:30px;
	width:180px;
	margin-top:10px;
	margin-right:10px;
	font-size:14px;
}
.footer_BC{
    font-size: 25px;
    background-color: rgb(147, 164, 180);
}
/*----------------quiz_me_info 결과보기----------------------*/

#qmeinfo{
    width: 100%;
    background-color: #EEEEEE;
    margin :0 auto;
}
#qmeinfo>.bottom{width: 100%;position:relative;bottom:0;height: 150px;}
#back_meinfo_grayborder{ /*회색테두리*/
    background: white;
    margin-top: 20px;
    border-radius: 15px;
    text-align: center;
    margin-bottom: 20px;
    padding : 10px;
    border: 1px solid silver;
}
#back_infoall2{
	text-align: center;
    max-width: 100%;
    border-radius: 5px;
    padding-bottom: 50px;
	margin:0 auto; /*좌우 바깥 여백을 자동할당 시켜서 중앙 정렬로*/
}
.info_main{
    display: inline-block;
    max-width:800px;
    height: 280px;
    text-align: center;
    margin-top: 20px;
    margin-bottom: 20px;
}

.info_up{
    background-color: #ffffff;
    position: relative;
    text-align: center;
    padding-top: 7px;
    height:80px;
    width: 100%;
    margin-left:40px;
    margin-right: 40px;
    vertical-align: middle;
	margin:0 auto;
    line-height: 1.3;
    z-index:1;
    border-end-start-radius: 10px; 
    border-end-end-radius: 10px;
    border-bottom: solid 1px lightgray;
    box-shadow: 2px 2px 2px rgba(0,0,0,15%);
}
.info_top_title2_2{
	font-weight: 900;
    font-size: 2rem;
	color:#8C8C8C;
    float: center;	
    letter-spacing:-0.5px;
}
.info_top_title3_2{
	font-weight: 900;
    font-size: 3rem;
	color:#BDBDBD;
    float: center;	
    padding-bottom: 10px;
    letter-spacing:-1px;
}

.rounded_box_info1{
    position: relative;
	font-weight:bold;
    height:100%;
    max-width: 100%;
    background-color:#FFFFFF;
	border-radius:25px;
    border-top: solid 1px rgba(174, 174, 174, 0.555);
    border-left: solid 1px rgba(174, 174, 174, 0.555);
    box-shadow: 1px 2px 2px rgba(0,0,0,20%);
    word-break: break-all;
    text-align: left;
}
hr.line_quiz_name{
    border:solid 1px gray;
    padding-bottom: 3px;
    border-bottom: solid 2px lightgray;
    width: 80%;
}
.info1_txt{
    position: absolute;
    top: 52%;
    line-height: 75%;
    width: 100%;
    padding-top: 2%;padding-bottom: 1%;padding-right: 7%;padding-left: 7%;
    transform: translateY(-50%);
  /*  background-color: #86bbd842;*/
    color: #2F4858;
    letter-spacing: -1px;
    font-weight: 500;
    font-size: 3rem;
}
.info1_txt>div#quiz_name{text-align:center;border-bottom: solid 1px lightgray;padding-bottom: 10px;height:95%;line-height: 95%;font-size:2rem;}
#testmode,#cate_name{text-align:center;font-size:2rem;height:50%;line-height: 50%;}
#quiznum,#time_view{font-size:2rem;height:60%;line-height: 60%;}
#selmode{
    text-align: center;
    background: #118AB2;
    border-radius: 15px;
    width: 80%;
    color: white;
	font-size: 2.5rem;
    font-weight: 800;
    width: auto; height: 50px;line-height: 50px;
}
.rounded_box_info11{
	font-style: bold;
	font: 3rem/100% 'NanumSquareRound' ;
	font-weight:bold;
	text-align:center;	
	width: 300px;
	height: 30px;
	line-height: 25px;/*height높이와 같게하면 위아래로 꽉차서 세로가운데정렬 정상작동함*/
    background-color:#FFFFFF;
	padding-left: 10px; 
	padding-right: 10px; 
	margin-top: 1px;
	margin-bottom: 1px;
	border-radius:0.5em;
	-moz-border-radius: 0.5em;
	-webkit-border-radius: 0.5em;
}

.rbox_row1 {display: table-row;}
.rbox_row2 {display: table-row;}
.cell1 {
	text-align:center;display: table-cell;border-bottom:2px solid rgb(196, 196, 196);width: 33%;font-weight: 900;font-size: 1.0rem;
    padding-left: 3px;padding-right: 3px;padding-top: 7px;
    padding-bottom: 7px;
    background-color: rgba(208, 208, 208, 0.412); font-size: 2.5rem;
     }
.cell2{
    text-align:center;display: table-cell; width: 33%;font-weight: 800;
    padding-left: 5px;padding-right: 5px;
    padding-top: 7px;font-size: 3.0rem}

#rbox_resulttable{
    position: relative;
	text-align:center;
    margin: 0 auto;	
	width: 700px;
	height: auto;
    display: table;
	font: 3rem 'NanumSquareRound' ;
    word-break: break-all;
    text-align: left;
    padding-bottom: 11px;
    color: rgb(99, 84, 86);
    margin-top: 30px;
    margin-bottom: 10px;
}
.result_title{
    background-color: lightpink;
	font: 17px/100% 'NanumSquareRound' ;
	font-weight:bold;
    color: white;
    width: 300px;
    border-bottom: lightslategray;
}

.rounded_box_info2{
	font-style: bold;
	font: 15px/100% 'NanumSquareRound' ;
	font-weight:bold;
	text-align:center;	
	width: 50px;
	height: 30px;
	line-height: 30px;/*height높이와 같게하면 위아래로 꽉차서 세로가운데정렬 정상작동함*/
    background-color:#CEFBC9;	
}
.rounded_box_info3{
    position: relative;
	text-align:center;		
	width: 600px;
	height: 50px;
  /*  background-color:#f1f6ff;
    border-bottom: solid 1px #C0C0C0;*/
	opacity:0.9;
	margin-bottom: 1px;
	line-height: 50px;
	border-radius:0.5em;
}
#rbox4_border1{margin-top: 15px;}
#rbox4_border2{margin-top: 15px;}
#rbox4_border3{margin-top: 15px; }
.round_box_info4{ 
    position:relative;
    margin: 0 auto;
    text-align: center;
    width: 350px;
    height: 50px;
    line-height: 50px;
    border-radius: 25px;
    font-family: 'Roboto', sans-serif;
    font-size: 2.0rem;
    text-transform: uppercase;
    letter-spacing: -1px;
    font-weight: 550;
    color: #fff;
    background-color: #f8ad21;
    border: none;
    box-shadow: 0px 8px 15px #f6b02d59;
    transition: all 0.3s ease 0s;
    cursor: pointer;
}
.round_box_info4:hover {
    opacity: 50%;
    cursor: pointer;
    font-size: 2.3rem;
}
.round_box_info5{ 
    position:relative;
    margin: 0 auto;
    text-align: center;
    width: 350px;
    height: 50px;
    line-height: 50px;
    border-radius: 25px;
    font-family: 'Roboto', sans-serif;
    font-size: 2.0rem;
    text-transform: uppercase;
    letter-spacing: -1px;
    font-weight: 550;
    color: #fff;
    background-color: #A64D79;
    border: none;
    box-shadow: 0px 8px 15px #FF77B7;
    transition: all 0.3s ease 0s;
    cursor: pointer;
}
.round_box_info5:hover {
    opacity: 50%;
    cursor: pointer;
    font-size: 2.3rem;
}
.round_box_info6{ 
    position:relative;
    margin: 0 auto;
    text-align: center;
    width: 350px;
    height: 50px;
    line-height: 50px;
    border-radius: 25px;
    font-family: 'Roboto', sans-serif;
    font-size: 2.0rem;
    text-transform: uppercase;
    letter-spacing: -1px;
    font-weight: 550;
    color: #fff;
    background-color: #8BBDFF;
    border: none;
    box-shadow: 0px 8px 15px #abcdf9;
    transition: all 0.3s ease 0s;
    cursor: pointer;
}
.round_box_info6:hover {
    opacity: 50%;
    cursor: pointer;
    font-size: 2.3rem;
}
.round_box_info7{ 
    position:relative;
    margin: 0 auto;
    text-align: center;
    width: 350px;
    height: 50px;
    line-height: 50px;
    border-radius: 25px;
    font-family: 'Roboto', sans-serif;
    font-size: 2.0rem;
    text-transform: uppercase;
    letter-spacing: -1px;
    font-weight: 550;
    color: rgb(99, 84, 86);
    background-color: rgba(208, 208, 208, 0.412);
    border: none;
    box-shadow: 0px 8px 15px rgba(208, 208, 208, 10%);
    transition: all 0.3s ease 0s;
    cursor: pointer;
}
.yellow_round_box_info1{
    background: #FEC900;
	display:block;
    border-radius: 10px; 
	width: 200px;	
    height: 40px;
    line-height: 40px;/*height높이와 같게하면 위아래로 꽉차서 세로가운데정렬 정상작동함*/
    text-align: center;
    margin-top: 5px; 	
    margin-bottom: 10px;
    color: #00162B;/*navy*/
    font-size: 16px;
    font-weight: 900;
    box-shadow: 3px 3px 3px rgba(0,0,0,10%);
}
.yellow_round_box_info1:hover{
    opacity: 50%;
    cursor: pointer;
    font-size: 22px;
}
/*------------------------------------*/
#infotestout2{
	width: 100%;
	height: 600px;
    text-align: center;
    background-color:#949aad;
    padding: 250px 0 100px 0;font-size:2rem;
}
.letter{font-size:2rem;}
.back>span>#timer{font-size:3rem;}
 @keyframes go-left-right {        /* 애니메이션 이름 지정: "go-left-right" */
    from { left: -5px; }             /* left 0px 부터 애니메이션 시작 */
    to { left: calc(5% - 5px); } /* left 값이 100%-50px 될 때까지 애니메이션 적용 */
  }

/*위의 회색테두리버전은 옵션이 같지만 width가 다를때는
이렇게 상위를 위에로잡고 하위를 아래로 잡으면 간단함*/
.width570{height: auto; width: 570px;}/* width가 570인것*/
.width450{height: auto; width: 450px;}/* width가 450인것*/

#back_meinfo_grayborder>.result{
    margin : 10px;
}
#back_meinfo_grayborder>.result>input[type="text"]{
    width: auto;
    padding: 2px;
    border: 1px solid silver;
    margin: 0 auto;
    text-align:center;height:25px;font-size:17px;
}

.width450>input[type="text"]{
    margin : 10px;
    padding: 1px;
    font-size: 35px;
    font-weight: 700;
    background-color: yellow;
    border: 1px solid rgba(0,0,0,0%);;
    margin: 0 auto;
    text-align:center;
}
/*----------------quiz_me_info_all 문제풀이집계----------------------*/
#back_infoall{
    background-color:white;
    width: 1100px;
	height: auto;
    border-radius: 20px;
    padding: 20px;
	text-align:center;
    display:block;
    text-align: center;
    margin-top: 30px;
}
.qinfo_all{
    background-color: slategray;
    height: auto;
    padding-top: 20px;
    padding-bottom: 20px;
}
.gray_round_box_all{
    margin-top: 20px; 
	margin-left: 10px;
	margin-right: 10px;
    margin-bottom: 30px;
	width: 120px;
	display:inline-block;
    border-radius: 10px;
    height: 50px;
    line-height: 50px;/*height높이와 같게하면 위아래로 꽉차서 세로가운데정렬 정상작동함*/
    text-align: center;
    font-size: 25px;
    font-weight: 900;
    background-color: #ffd166;
    color: #444444;
    box-shadow: 5px 5px 5px rgba(0,0,0,10%);
}

.gray_round_box_all:hover{
    opacity: 50%;
    cursor: pointer;
    font-size: 33px;
    margin-bottom: -5px;
}
.round_box_all_1{
    margin-top: 10px; 
	margin-left: 10px;
	margin-right: 10px;
    margin-bottom: 15px;
	width: 220px;
	display:inline-block;
    border-radius: 10px;
    height: 35px;
    line-height: 35px;/*height높이와 같게하면 위아래로 꽉차서 세로가운데정렬 정상작동함*/
    text-align: center;
    font-size: 17px;
    font-weight: 900;
    background-color: #D17D98;
    color: #ffffff;
    box-shadow: 5px 5px 5px rgba(0,0,0,10%);
}

.round_box_all_1:hover{
    opacity: 50%;
    cursor: pointer;
    font-size: 18px;
}
.infoall_txt1{
	width: 150px;
    margin: 10px;
    font-size: 25px;
	font-weight: 900;
	text-align: left;
	color:#a3a3a3;
	margin-top : 1px;
	margin-bottom : 1px;
    font-family: 'NanumSquare' ;
}
.infoall_title{color: rgb(61, 61, 61);
font-size:17pt;font-weight:bold;margin-top: 35px;margin-bottom: 40px;
position: relative;
    margin: 0 auto;
    text-align: center;
    width: 370px;
    height: 55px;
    line-height: 55px;
    font-family: 'NanumSquareRound' ;
    font-size: 2.5rem;
    text-transform: uppercase;
    letter-spacing: -1px;
    font-style: bold;
    padding-left: 30px;padding-right: 30px;padding-top: 10px;padding-bottom: 10px;
    border-top: 6px solid #EF476F;
    border-bottom: 6px solid #EF476F;
}

/*---quiz_group_page 학습하기 결과보기---------------------------------------------------*/
#group_page{
	text-align: center;
	margin-top: 30px;
	width: 100%;
	margin:0 auto; /*좌우 바깥 여백을 자동할당 시켜서 중앙 정렬로*/
	height: 600px;
}
.group_page_top_title1{
    background: #47C83E;
	width: 100%;
	height: 50px;
    margin-bottom: 7px;
	line-height: 50px;/*height높이와 같게하면 위아래로 꽉차서 세로가운데정렬 정상작동함*/
	font-weight: 900;
    font-size: 20px;
    float: center;
}
/* 노란색 라운딩 작은박스 */
.group_page_blue_round_box_st1{
    background: #118AB2;
    margin-top: 35px; width: 500px;
	display:block;
    border-radius: 40px;
    height: 70px;
    line-height: 70px;/*height높이와 같게하면 위아래로 꽉차서 세로가운데정렬 정상작동함*/
    text-align: center;
    margin-bottom: 35px;
    color: white;/*navy*/
    font-size: 24px;
    font-weight: 900;    
    box-shadow: 11px 11px 10px rgba(0,0,0,30%);
}
.group_page_blue_round_box_st1:hover{
    opacity: 50%;
    cursor: pointer;
    font-size: 28px;
}

/*---quiz_group_join 학습하기 결과보기---------------------------------------------------*/

/* id속성은 class 보다 더 우선적으로 적용됩니다.
회색 테두리만 적용된 box 클래스 위에 보라색 상단 테두리를 제일 앞으로 나오게 하기 위해 id속성에서 작성하였습니다.*/

#group_join{
    min-height: 700px;
    text-align: center;
    width: 100%;
}

.group_join_txt1{
    color: #00162B;
    font-size: 45px;
    line-height: 0.9;
    font-weight: 900;
	width: 900px;
	text-align: center;
	margin-bottom: 20px;
	margin-top: 20px;
    letter-spacing: -2px;
}
.group_join_txt2{
    color: #00162B;
    font-size: 27px;
    line-height: 1.5;
    font-weight: 600;
	width: 900px;
	text-align: left;
	margin-bottom: 5px;
	margin-top: 5px;
    letter-spacing: -2px;
}
.group_join_box{
    width: 650px;
    float: left;
    text-align: center;
    padding-top: 10px;
    padding-bottom: 10px;
}
.group_join_txt3{
    color: #00162B;
    font-size: 45px;
    line-height: 0.9;
    font-weight: 900;
	margin-bottom: 20px;
	margin-top: 20px;
    letter-spacing: -2px;
}
.group_box{
    margin: 0 auto;
    width : 1000px;height: auto;
    position: relative;
    display: inline-block;
    vertical-align: middle;
    margin-top: 30px;
    background-color: linen;
    border-radius: 20px;
    padding: 20px;
}
.group_join_qr{
    height: 250px;
    width: 300px;
    padding: 10px;
    float: right;
}

.group_join_txt4{
    color: #00162B;
    font-size: 40px;
    line-height: 0.9;
    font-weight: 700;
	margin-bottom: 20px;
	margin-top: 30px;
    letter-spacing: -2px;
}
/*----------------quiz_group_chk_ok----------------------*/
.group_chk_ok_top_title2{
	height: 30px;
	margin-top: 30;
    margin-bottom: 30px;
	font-weight: 900;
    font-size: 55px;
	color:#393939;
    float: center;
}
.group_chk_ok_top_title3{
	height: 30px;
	margin-top: 50px;
    margin-bottom: 30px;
	font-weight: 900;
    font-size: 30px;
	color:#393939;
    float: center;
}
.group_chk_ok_top_title4{
	height: 20px;
	margin-top: 10px;
    margin-bottom: 10px;
	font-weight: 700;
    font-size: 20px;
	color:#393939;
    float: center;
}
.group_chk_ok_top_algin{
	width: 100%;
	height: 25px;
    font-size: 13px;
	line-height: 25px;
	font-weight: 900;
	text-align: center;  
	color:#5D5D5D;
	background-color: #EAEAEA;
	margin-top : 1px;
	margin-bottom : 1px;
}
.group_chk_ok_txt1{
	width: 700px;
    font-size: 25px;
	font-weight: 900;
	text-align: left;
	color:#8C8C8C;
	margin-top : 1px;
	margin-bottom : 1px;
}
.group_chk_ok_txt2_gen{
	width: 700px;
    font-size: 30px;
	font-weight: 700;
	text-align: left;
	margin-top : 1px;
	margin-bottom : 2px;
}
.group_chk_ok_txt2_100_1{
	background-color:#B2CCFF;
	width: 290px;
    font-size: 15px;
	font-weight: 700;
	text-align: left;
	margin-top : 1px;
	margin-bottom : 2px;
}
.group_chk_ok_txt2_90_1{
	background-color:#D9E5FF;
	width: 290px;
    font-size: 15px;
	font-weight: 700;
	text-align: left;
	margin-top : 1px;
	margin-bottom : 2px;
}
.group_chk_ok_txt2_gen_1{
	background-color:#D4F4FA;
	width: 290px;
    font-size: 15px;
	font-weight: 700;
	text-align: left;
	margin-top : 1px;
	margin-bottom : 2px;
}
.group_chk_ok_txt2_100_2{
	background-color:#B7F0B1;
	width: 290px;
    font-size: 15px;
	font-weight: 700;
	text-align: left;
	margin-top : 1px;
	margin-bottom : 2px;
}
.group_chk_ok_txt2_90_2{
	background-color:#CEFBC9;
	width: 290px;
    font-size: 15px;
	font-weight: 700;
	text-align: left;
	margin-top : 1px;
	margin-bottom : 2px;
}
.group_chk_ok_txt2_gen_2{
	background-color:#F6F6F6;
	width: 290px;
    font-size: 15px;
	font-weight: 700;
	text-align: left;
	margin-top : 1px;
	margin-bottom : 2px;
}
.group_chk_ok_txt3{
	width: 290px;
    font-size: 12px;
	text-align: right;
	font-weight: 300;
}
.group_chk_ok_txt3_1{
	width: 700px;
    font-size: 25px;
	text-align: right;
	font-weight: 500;
}
.group_chk_ok_line1{
	width: 800px;
	margin-top : 5px;
	border-top: 3px solid #FFD8D8;
	height: 10px;
}
/*----------------quiz_group_mem_list----------------------*/
select::-ms-expand { 
  /*display: none;*/
}
select {
  /*-o-appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;*/
}

.select_pl{
    width: 170px;
    border: 1px solid #C4C4C4;
    box-sizing: border-box;
    border-radius: 5px;
    padding: 5px 6px;
	background-color: #EAEAEA;
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 700;
    font-size: 14px !important;
    line-height: 16px;
}
.select_pl:focus{
    border: 1px solid #9B51E0;
    box-sizing: border-box;
    border-radius: 7px;
    outline: 3px solid #F8E4FF;
    border-radius: 10px;
}

/* ------------------------------------------------------- */
.quiz_group_mem_list_top_title2{
	height: 30px;
	margin-top: 30;
    margin-bottom: 40px;
	font-weight: 900;
    font-size: 55px;
	color:#8C8C8C;
    float: center;
}
.quiz_group_mem_list_top_title3{
	height: 20px;
	margin-top: 10px;
    margin-bottom: 10px;
	font-weight: 700;
    font-size: 20px;
	color:#BDBDBD;
    float: center;
}
.quiz_group_mem_list_top_title4{
	height: 20px;
	margin-top: 10px;
    margin-bottom: 10px;
	font-weight: 700;
    font-size: 20px;
	color:#393939;
    float: center;
}
.table_1_2_mem_area{
	margin-top: -10px;
	padding-top: 5px;
	padding-bottom: 5px;
	background-color: #EEEEEE;
	text-align: center;
	line-height: 25px;/*height높이와 같게하면 위아래로 꽉차서 세로가운데정렬 정상작동함*/
	display: block;
	height: 85px;
	width: 1150px; 
    float: center;	
}	
.table_1_2_mem{ 
	text-align: left;
	color:#303030;
	font-size: 17px;
	font-weight: 900;
	line-height: 25px;/*height높이와 같게하면 위아래로 꽉차서 세로가운데정렬 정상작동함*/
	height: 25px;
	width: 100%; 
    float: left;
	padding-left: 150px;	
}
.table_mem{
    display: table;float: left;margin:10px;width: 40%;
	color:#212121;
}
.table_menu2_mem_area{
	padding-top: 5px;
	padding-bottom: 5px;
	text-align: center;
	line-height: 25px;/*height높이와 같게하면 위아래로 꽉차서 세로가운데정렬 정상작동함*/
	min-width: 1130px; 
	display: block;
	height: 136px;
	width: 1150px; 
    float: center;	
}
.table_menu2_mem{
    display: table;
	padding-left: 15px;
	float: left;
	margin:0px;
	width: 100%;
	max-width: 1150px;
}
.row_mem{display:table-row;}
.quiz_group_mem_list_line1{
	width: 1150px;
	margin-top : 5px;
	border-top: 3px solid #FFD8D8;
	height: 5px;

}
.txt1_mem{
    font-size: 15px; 
    font-weight: 900;
    float: left;
    margin-right: 5px;
    min-width: 100px;
    width: auto;
}
.txt2_mem{
    font-size: 18px; 
    font-weight: 900;
    float: left;
    margin-right: 5px;
    width: auto;
    min-width: 220px;
}
.txt3_mem{
	font-weight: 700;
    font-size: 20px;
	color:#BDBDBD;
    float: center;
}
.mem_gray_small_box1{
    display: inline-block;
    position: relative;
    background: #D6E4E5;
    width: 95px;
    height: 30px;
    line-height: 30px;/*height높이와 같게하면 위아래로 꽉차서 세로가운데정렬 정상작동함*/
    text-align: center;
    color: #00162B;/*navy*/
    font-weight: 900;
    float: left;
    margin: 5px;
    box-shadow: 3px 3px 3px rgba(0,0,0,30%);
    border-radius: 5px;
}
.mem_gray_small_box1>input[type="image"]{ /* input 태그 중 type='text'인 것만 선택*/
    width: 80px;
    height: 30px;
    outline: 0px;
    position: absolute;
    top: 0px;
    left: 0px;
    text-align: center;
    background-color: rgba(0,0,0,0%);
    display: hidden;
    margin-right: 10px;
}
/* 각 div에 개별적으로 색상 지정 */
.color1 {
    color: black;
}

.color2 {
     color: #FF851B;  
}

.color3 {
	color: #5B99C2;
}