@charset "UTF-8";
/* CSS Document */

section, article, aside, footer, header, nav, h2 { display:block;}

body { padding:0; margin:0 auto; color: #414141; font-size:1em; font-family: 'Noto Sans TC', sans-serif, "微軟正黑體", Arial; background-color: #fff; position: relative;}
img { border:0; display: block;}

html, body { height: 100%;}

.clearfix:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0;}
.clearfix { display: inline-block; }
* html .clearfix { height: 1%; }
.clearfix { display: block; }

div.brk { clear: both;}


/************ video box ************/
.video-container { position:relative; padding-bottom:56.25%; padding-top:30px; width:100%; height: 0px; overflow:hidden;}
.video-container iframe, .video-container object, .video-container embed { position:absolute; top:0; left:0; width:100%; height:100%;}


@media screen and (min-width: 1600px) {

  /************ section#question-sheet ************/

  section#question-sheet { clear: both; width: 100%; padding: 200px 0 80px 0;}

  .question-sheet-title { clear: both; width: 60%; padding: 0 0 60px 0; margin: 0 auto; color: #000; font-size: 2rem; font-weight: 500; line-height: 1.4em; text-align: center;}

  .question-sheet-text-exp { clear: both; width: 60%; margin: 0 auto; color: #000; font-size: 1.2rem; line-height: 1.8em;}

  .question-sheet-list { clear: both; width: 60%; padding: 30px 0 0 0; margin: 30px auto 0 auto; color: #000; font-size: 1.2rem; line-height: 1.8em; border-top: 1px #ccc solid;}
  
  span.color-red { color: #990000;}
  
  .question-sheet-list .caption { width: 100%; padding: 0 0 10px 0; font-weight: 500;}
  .question-sheet-list .column { width: 100%; padding: 0 0 30px 0;}
  .question-sheet-list .column input[type=text], 
  .question-sheet-list .column input[type=email], 
  .question-sheet-list .column input[type=file] { width: 600px; padding: 10px 0; color: #000; font-size: 1.1rem; border: 0; border-bottom: 2px #000 solid; background-color: #fff; box-sizing: border-box;}
  .question-sheet-list .column .note { width: 100%; color: #666; font-size: 0.9rem; line-height: 1.4em;}
  .question-sheet-list input[type=submit], 
  .question-sheet-list input[type=button] { clear: both; padding: 8px 40px; color: #fff; font-size: 1.1rem; border: 0; border-radius: 6px; background-color: #432C1F; cursor: pointer;}


}

@media screen and (min-width: 1280px) and (max-width: 1600px) {

  /************ section#question-sheet ************/

  section#question-sheet { clear: both; width: 100%; padding: 200px 0 80px 0;}

  .question-sheet-title { clear: both; width: 70%; padding: 0 0 60px 0; margin: 0 auto; color: #000; font-size: 2rem; font-weight: 500; line-height: 1.4em; text-align: center;}

  .question-sheet-text-exp { clear: both; width: 70%; margin: 0 auto; color: #000; font-size: 1.2rem; line-height: 1.8em;}

  .question-sheet-list { clear: both; width: 70%; padding: 30px 0 0 0; margin: 30px auto 0 auto; color: #000; font-size: 1.2rem; line-height: 1.8em; border-top: 1px #ccc solid;}
  
  span.color-red { color: #990000;}
  
  .question-sheet-list .caption { width: 100%; padding: 0 0 10px 0; font-weight: 500;}
  .question-sheet-list .column { width: 100%; padding: 0 0 30px 0;}
  .question-sheet-list .column input[type=text], 
  .question-sheet-list .column input[type=email], 
  .question-sheet-list .column input[type=file] { width: 600px; padding: 10px 0; color: #000; font-size: 1.1rem; border: 0; border-bottom: 2px #000 solid; background-color: #fff; box-sizing: border-box;}
  .question-sheet-list .column .note { width: 100%; color: #666; font-size: 0.9rem; line-height: 1.4em;}
  .question-sheet-list input[type=submit], 
  .question-sheet-list input[type=button] { clear: both; padding: 8px 40px; color: #fff; font-size: 1.1rem; border: 0; border-radius: 6px; background-color: #432C1F; cursor: pointer;}
  

}

@media screen and (min-width: 768px) and (max-width: 1280px) {

  /************ section#question-sheet ************/

  section#question-sheet { clear: both; width: 100%; padding: 200px 0 80px 0;}

  .question-sheet-title { clear: both; width: 80%; padding: 0 0 60px 0; margin: 0 auto; color: #000; font-size: 2rem; font-weight: 500; line-height: 1.4em; text-align: center;}

  .question-sheet-text-exp { clear: both; width: 80%; margin: 0 auto; color: #000; font-size: 1.2rem; line-height: 1.8em;}

  .question-sheet-list { clear: both; width: 80%; padding: 30px 0 0 0; margin: 30px auto 0 auto; color: #000; font-size: 1.2rem; line-height: 1.8em; border-top: 1px #ccc solid;}
  
  span.color-red { color: #990000;}
  
  .question-sheet-list .caption { width: 100%; padding: 0 0 10px 0; font-weight: 500;}
  .question-sheet-list .column { width: 100%; padding: 0 0 30px 0;}
  .question-sheet-list .column input[type=text], 
  .question-sheet-list .column input[type=email], 
  .question-sheet-list .column input[type=file] { width: 100%; padding: 10px 0; color: #000; font-size: 1.1rem; border: 0; border-bottom: 2px #000 solid; background-color: #fff; box-sizing: border-box;}
  .question-sheet-list .column .note { width: 100%; color: #666; font-size: 0.9rem; line-height: 1.4em;}
  .question-sheet-list input[type=submit], 
  .question-sheet-list input[type=button] { clear: both; padding: 8px 40px; color: #fff; font-size: 1.1rem; border: 0; border-radius: 6px; background-color: #432C1F; cursor: pointer;}


}

@media screen and (max-width: 768px) {

  /************ section#question-sheet ************/

  section#question-sheet { clear: both; width: 100%; padding: 200px 0 80px 0;}

  .question-sheet-title { clear: both; width: 90%; padding: 0 0 60px 0; margin: 0 auto; color: #000; font-size: 2rem; font-weight: 500; line-height: 1.4em; text-align: center;}

  .question-sheet-text-exp { clear: both; width: 90%; margin: 0 auto; color: #000; font-size: 1.2rem; line-height: 1.8em;}

  .question-sheet-list { clear: both; width: 90%; padding: 30px 0 0 0; margin: 30px auto 0 auto; color: #000; font-size: 1.2rem; line-height: 1.8em; border-top: 1px #ccc solid;}
  
  span.color-red { color: #990000;}
  
  .question-sheet-list .caption { width: 100%; padding: 0 0 10px 0; font-weight: 500;}
  .question-sheet-list .column { width: 100%; padding: 0 0 30px 0;}
  .question-sheet-list .column input[type=text], 
  .question-sheet-list .column input[type=email], 
  .question-sheet-list .column input[type=file] { width: 100%; padding: 10px 0; color: #000; font-size: 1.1rem; border: 0; border-bottom: 2px #000 solid; background-color: #fff; box-sizing: border-box;}
  .question-sheet-list .column .note { width: 100%; color: #666; font-size: 0.9rem; line-height: 1.4em;}
  .question-sheet-list input[type=submit], 
  .question-sheet-list input[type=button] { clear: both; padding: 8px 40px; color: #fff; font-size: 1.1rem; border: 0; border-radius: 6px; background-color: #432C1F; cursor: pointer;}
  

}