header div {height:60px; }
header  {	display:block;	width:100%;	height:60px;	background-color:#3aa796;	line-height: 60px;}
.Designer_logo a{background-image:url(/images/logo/2017/80X45_white.png);	width: 80px;	height: 42px;	position: absolute;	left:5px;	top:10px;}


.container #wrapper{ font-size: 16px;line-height: 1.6em;background-color: #253241;color: #fff;}
h1{text-indent: 100%;white-space: nowrap;overflow: hidden;height: 0;}
.event{ display: block; width: 140px; height:300px; position:fixed; left: 50%; margin-left:630px;top:10px;}
.logo{ background-color: #333333;padding: 5px;}
.main_visual{ max-width: 1250px;height: 500px;background-image:url(/images/event/2018/trendquiz/event_visual_2019.jpg);margin: 0 auto;background-size: contain;background-repeat: no-repeat; }
.exterior{display: block; max-width: 1200px; margin: 0 auto;margin-top:0px;padding: 0 20px;}
.exterior h2{font-size:1.8em; line-height:2em;color: #cca19a;font-weight:500;margin-top:15px;}
.exterior ul li{list-style-type: decimal;margin-left:40px; }
.exterior h2+p{margin-left:20px;font-size: 1.5em;font-weight: 500; }
.box{display:flex;flex-wrap:wrap;justify-content: space-around;}
.box div{max-width:200px;text-align: center;margin: 0 auto;margin-bottom:40px;}
.box div a{ display: block;}
.box div h3{ font-weight:500; font-size: 18px;margin-bottom:10px;color: #fff;}
.box div p{font-size: 14px;color: #bbbbbb;}
.btn{display:block; text-align: center;}
.btn a{ display:inline-block;text-align: center; margin: 0 ; width:250px;height: 40px; line-height: 40px;font-size: 1.2em; color: #cca19a;border:1px solid #cca19a;margin:50px 20px;font-weight: 500;}
.btn a:hover{background-color: #cca19a; color:#253241;  } 
.sponser{ text-align: center;padding-bottom: 50px;}

.question_area{ display: block; max-width: 1000px; padding:30px; box-sizing:border-box; margin:0 auto; text-align: center; color: #fff;line-height: 2.2em;}
.question_area h2{font-size: 2.5em;margin-top: 0;}
.question_area span{ color: #ff1f5e;display: block;font-size:2em;margin-bottom: 30px;font-weight: 500;}
.question_area strong{ display: block; color:#cca19a;font-size:1.6em; font-weight: 500;}
.exterior .question_area p{display:block;width:60%; margin: 0 auto; margin-top:20px; line-height:1.6em; padding-bottom: 30px; border-bottom: 1px solid #505050;}
.question_img{ display: block; max-width: 60%; margin: 0 auto;height: 0; padding-bottom:40%; overflow: hidden; margin-top:30px;}
.question_img img{width: 100%}
.send { display: inline-block; width: 25%; height: 50px; line-height: 50px; color: #fff;  margin:30px 20px; padding: 0 15px; }
.no{ background-color:#5f5f5f; }
.no:hover{background-color:#454545;}
.fb_color{background-color:#4267b2;}
.fb_color:hover{background-color:#33518d;}
.yes , .back{ background-color:#cca19a; }
.yes:hover , .back:hover{background-color:#c37a6f;}
.start{ display: block; width: 25%; line-height: 50px; height: 50px; text-align: center;background-color: #b3253d; color: #fff; margin: 0 auto; margin-bottom: 50px; }
.start:hover{background-color: #801c2d; }
.start:hover{background-color: #801c2d; }
.question_area i{ display: block;}
.question_area i a{ color:#cca19a; text-decoration: underline; }

/*¤À¨É¤¸¥ó*/
.fb_share {
    position: absolute;
    right: 0;
    margin-top: -40px;
    margin-right: 0px;
}
.fb_base,.line_base {
    float:left;
}

@media (max-width:1024px) {
    .main_visual{height: 400px;}
    
}

@media (max-width:768px) {
    .main_visual{height: 300px;}
    
}

@media (max-width:640px) {
    .main_visual{height: 250px;}
    .exterior{padding: 10px ;margin-top: 0;}
    .exterior h2{font-size:1.4em; }
    .btn a{ margin:10px;margin-bottom: 50px;}
    .question_img{  max-width: 90%;  padding-bottom:60%; margin-bottom: 20px;}
    .voucher li{width:50%; float: left; margin:0;text-align: left;margin-top: 20px;}
    .price li {margin-top: 20px;}
    .question_area h2{font-size:1.6em;}   
    .exterior .question_area p{width:100%;margin-bottom: 20px;}
    .question_area strong{font-size:1.4em; margin-bottom:0px;}    
    .question_area span{ margin-bottom: 10px;}
    .start{width: 60%;}
    .fb_share { margin-right: 0px;}
}

@media (min-width:375px) and (max-width:480px) {
    .main_visual{height: 190px;background-image:url(/images/event/2018/trendquiz/event480_2019.jpg);}
    .exterior{padding:0px;margin-top: 0;}
    .btn a{ margin:0px;margin-bottom:20px;}
    .sponser{margin-top: 40px;}
    .exam_rules{ margin-top: -50px}
    .exam_rules ul li{ line-height: 1.6em;margin-top:20px;}
    .voucher li , .price li{width:100%; margin-top:20px; margin: 0 auto;text-align: center;}
    .price img{margin: 0 auto;float: none;margin-top:15px;}   
    .send {  width: 80%;  margin:10px; }
    .no , .yes{  width:25%;  }
    .sponser{ height: 90px;}   
}

@media (max-width: 320px) {
    .question_area { padding: 0px;}
    .main_visual { height:130px; }
    .fb_share { margin-right: 10px;}
    .fb_base div:last-child { display: none;}
}