/**************************************/
/* Theme Original Styles */
/**************************************/

/* Imports */
/*------------------------------------*/
@import "/hc/theming_assets/01KSRSJM47YZAQGTXWN5M2AM15";
@import "/hc/theming_assets/01KSF6V9YJNVKE4H2T3M975MCK";

/* Settings Valiables */
/*------------------------------------*/
:root{
  --text_font: Noto Sans JP, -apple-system, blinkmacsystemfont, 'Segoe UI', 'Hiragino Kaku Gothic ProN', 'BIZ UDPGothic', 'meiryo', sans-serif;
  --heading_font: Noto Sans JP, -apple-system, blinkmacsystemfont, 'Segoe UI', 'Hiragino Kaku Gothic ProN', 'BIZ UDPGothic', 'meiryo', sans-serif;

  --text_color: #2F3941;
  --brand_color: #17494D;
  --brand_text_color: #FFFFFF;
  --background_color: #FFFFFF;
  --link_color: #1F73B7;
  --hover_link_color: #0F3554;
  --visited_link_color: #9358B0;

  --homepage_background_image: url('/hc/theming_assets/01KK8R10HBH189EEHE6HGB95QZ');
  --service_catalog_hero_image: url('/hc/theming_assets/01KK8R11F9RWF87K82AX74NC3C');
  --community_image: url('/hc/theming_assets/01KK8R115YT68PD8AXHZ6GVETN');
  --community_background_image: url('/hc/theming_assets/01KK8R10VMB2R281HJG36YW49M');
}

/* Variables */
/*------------------------------------*/
:root{
  --border-color: #989898;
  --second-color: #E3E7EB;
  --brand-color: #0074BF;
  --option-color: #458257;
  --accent-color: #EB5B5A;
  --hint-color: #434343;
  --field-headline-color: #D5D5D5;
  --field-border-color: #D5D5D5;
  --field-background-color: #EDFAFF;

  --copylight-color: #AAAAAA;

  --hover-opacity: 0.7;
}

/* Base */
/*------------------------------------*/
body{
  font-size: 16px;
  line-height: 1.5;
  /* letter-spacing: 0.12em;
  word-spacing: 0.16em; */
}
p{
  /* margin-bottom: 2em; */
}
input,
textarea {
  font-size: 1em;
}
.powered-by-zendesk{
  display: none;
}

/* Common */
/*------------------------------------*/
.inner{
  width: 100%;
  max-width: 100%;
  padding: 0 5%;
  margin: 0 auto;
}
.sp{
  display: block !important;
}
.pc{
  display: none !important;
}
.hide{
  display: none !important;
}

.request-form-button{
  color: #ffffff;
  background-color: var(--brand-color);
  border: 1px solid var(--brand-color);
  min-height: 3.6em;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: bold;
  font-size: 1em;
  line-height: 1.2;
}
.request-form-button:hover{
  color: #ffffff;
  background-color: var(--brand-color);
  border: 1px solid var(--brand-color);
  opacity: var(--hover-opacity)
}

@media (min-width: 768px) {
  .inner{
    max-width: 1280px;
    padding: 0 15%;
  }
  .sp{
    display: none !important;
  }
  .pc{
    display: block !important;
  }
}

/* Header */
/*------------------------------------*/
.header{
  max-width: 100%;
  width: 100%;
  padding: 0;
  border-bottom: 1px solid var(--border-color);
  display: block;
  height: auto;
}
.header .inner{
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0.1em 5%;
}
.header .title a{
  color: var(--brand-color);
  font-size: 1.2em;
  font-weight: bold;
  line-height: 1.2;
}
.header .title a:visited{
  color: var(--brand-color);
}
.header .title a:hover{
  opacity: var(--hover-opacity);
  text-decoration: none;
}
.header .logo img{
  max-height: none;
}
@media (min-width: 768px) {
  .header{
    height: 4.5em;
  }
  .header .inner{
    padding: 0 5%;
  }
}

/* Footer */
/*------------------------------------*/
.footer{ 
  border-top: 1px solid var(--border-color);
  font-size: 0.75em;
  padding: 5% 0;
}
.footer .inner{
} 
.footer .links{ 
  display: flex;
  justify-content: flex-start;
  flex-direction: column;
}
.footer .links + .links{ 
}
.footer .links li{
  margin-top: 0.1em;
}
.footer .copylight{
  color: var(--copylight-color);
}
@media (min-width: 768px) {
  .footer{ 
    padding: 2em 0;
  }
  .footer .links{ 
    flex-direction: row;
  }
  .footer .links + .links{ 
    margin-top: 0.1em;
  }
  .footer .links li{
    margin-top: 0;
    margin-right: 1.2em;
  }
}

/* New Request */
/*------------------------------------*/
/* Title */
.new-request-title{
  font-size: 1.1em;
  font-weight: bold;
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
}
.new-request-title .icon{
  padding-right: 0.3em;
}
.new-request-title .icon img{
  height: 2.5em;
}

/* Steps */
.new-request-steps{
  margin-top: 2em;  
}
.new-request-steps .new-request-steps-list{
  display: flex;
}
.new-request-steps .new-request-steps-item{
  width: 33%;
  height: auto;
  line-height: 1.3em;
  padding: 0.3em 0.9em;
  text-align: center;
  position: relative;
  font-size: 0.9em;
  overflow-wrap: break-word;
  background: linear-gradient(
    90deg,
    var(--second-color) 0%,
    var(--second-color) calc(100% - 1em),
    transparent calc(100% - 1em),
    transparent 100%
  );
}
.new-request-steps .new-request-steps-item:after{
  content: "";
  width: 1em;
  height: 100%;
  clip-path: polygon(0 0, 100% 50%, 0% 100%);
  background-color: var(--second-color);
  position: absolute;
  right: 0;
  top: 0;
}
.new-request-steps .new-request-steps-item:last-child{
  background: var(--second-color);
}
.new-request-steps .new-request-steps-item:last-child::after{
  display: none;
}
[data-active-step="input"] .new-request-steps-item[data-step="input"],
[data-active-step="confirm"] .new-request-steps-item[data-step="confirm"]{
  background: linear-gradient(
    90deg,
    var(--brand-color) 0%,
    var(--brand-color) calc(100% - 1em),
    transparent calc(100% - 1em),
    transparent 100%
  );
  color: #ffffff;
  font-weight: bold;
}
[data-active-step="input"] .new-request-steps-item[data-step="input"]:after,
[data-active-step="confirm"] .new-request-steps-item[data-step="confirm"]:after{
  background-color: var(--brand-color);
}
[data-active-step="complete"] .new-request-steps-item[data-step="complete"]{
  background: var(--brand-color);
  color: #ffffff;
  font-weight: bold;
}

/* Form */
.form{
  max-width: 100%;
  margin: 0 auto;
}
.new-request-form{}
.new-request-form .request-form-field{  
  margin-top: 2em;
  font-size: 1em;
}
.new-request-form .request-form-field .request-field-headline{
  font-size: 0.9em;
  background-color: var(--field-headline-color);
  line-height: 1.2;
  padding: 1em 0.7em;
  border-left: solid 5px var(--brand-color);  
}
.new-request-form .request-form-field .request-field-label{
  font-size: 0.9em;
}
.new-request-form .request-form-field .request-field-hint{
  font-size: 0.9em;
  color: var(--hint-color);
}
.new-request-form .request-form-field .request-field-label + .request-field-hint{
  margin-top: 0.4em;
}
.new-request-form .request-form-field .request-field-label span{
  display: none;
}
.new-request-form .request-form-field[data-field-required="true"] .request-field-label{
  position: relative;
  padding-left: 7em;
}
.new-request-form .request-form-field[data-field-required="true"] .request-field-label:after{
  content: '必須 / required';
  color: var(--accent-color);
  border: 1px solid var(--accent-color);
  padding: 0.3em 0.4em;
  line-height: 1;
  margin-right: 0.5em;
  border-radius: 3px;
  font-size: 0.8em;  
  position: absolute;
  left: 0;
  top: 0.1em;
  white-space: nowrap;
}
.new-request-form .request-form-field[data-field-required="true"][data-field-type="checkbox"] .request-field-label{
  padding-left: 8.5em; 
}
.new-request-form .request-form-field[data-field-required="true"][data-field-type="checkbox"] .request-field-label:after{
  left: 0;
}
.new-request-form .request-form-field[data-field-required="true"][data-field-type="checkbox"] .request-field-label:before{
  left: calc(6.8em + 2px);
}
.new-request-form .request-form-field[data-field-required="true"][data-field-type="checkbox"] .request-field-label > svg{
  left: 7.1em;
}

.new-request-form .request-form-field > input,
.new-request-form .request-form-field > textarea,
.new-request-form .request-form-field > .request-form-email-confirm > input,
.new-request-form .request-form-field > [data-garden-id="forms.faux_input"],
.new-request-form .request-form-field > [data-garden-id="dropdowns.combobox"]{
  border-color: var(--field-border-color);
  background-color: var(--field-background-color);
}
.new-request-form .request-form-field > [data-garden-id="dropdowns.combobox"] [data-garden-container-id="containers.combobox"]{
  background-color: transparent;
}
.new-request-form .new-request-form-footer{
  margin-top: 3em;
}
.new-request-form [data-garden-id="datepickers.day"][aria-disabled="true"]{
  opacity: 0.3;
}
.request-form-email-confirm{
  margin-top: 1em;
}

/* Import */
.new-request-file-import{
  border: 1px solid var(--border-color);
  padding: 1em;
}
.new-request-file-import p{
  margin: 0;
}
.new-request-file-import .buttons{
  margin: 1.2em 0 0 0;
}
.new-request-file-import .new-request-file-import-button{
  background: var(--brand-color);
  border: 1px solid var(--brand-color);
  color: #ffffff;
  font-weight: bold;
  width: 100%;
  margin: 0 auto;
}
.new-request-file-import .new-request-file-import-button:hover{
  background: var(--brand-color);
  border: 1px solid var(--brand-color);
  color: #ffffff;
  opacity: var(--hover-opacity);
}

/* Export */
.new-request-file-export{
  border: 1px solid var(--border-color);
  padding: 1em;
}
.new-request-file-export p{
  margin: 0;
}
.new-request-file-export .buttons{
  margin: 0 0 1.2em 0;
}
.new-request-file-export .new-request-file-export-button{
  background: var(--option-color);
  border: 1px solid var(--option-color);
  color: #ffffff;
  font-weight: bold;
  width: 100%;
  margin: 0 auto;
}
.new-request-file-export .new-request-file-export-button:hover{
  background: var(--option-color);
  border: 1px solid var(--option-color);
  color: #ffffff;
  opacity: var(--hover-opacity);
}

/* Buttons */
.request-form-buttons{
  display: flex;
  justify-content: flex-start;
  flex-direction: column;
  width: 100%;
}
.request-form-buttons .new-request-confirm{
  background: var(--brand-color);
  border: 1px solid var(--brand-color);
  color: #ffffff;
  font-weight: bold;
  width: 100%;
  margin: 0 auto;
}
.request-form-buttons .new-request-confirm:hover{
  background: var(--brand-color);
  border: 1px solid var(--brand-color);
  color: #ffffff;
  opacity: var(--hover-opacity);
}
.request-form-buttons .new-request-return{
  background: #ffffff;
  border: 1px solid var(--brand-color);
  color: var(--brand-color);
  font-weight: bold;
  width: 100%;
  margin: 0 auto;
}
.request-form-buttons .new-request-return:hover{
  background: #ffffff;
  border: 1px solid var(--brand-color);
  color: var(--brand-color);
  opacity: var(--hover-opacity);
}
.request-form-buttons .new-request-submit{
  background: var(--brand-color);
  border: 1px solid var(--brand-color);
  color: #ffffff;
  font-weight: bold;
  width: 100%;
  margin: 1em auto 0 auto;
}
.request-form-buttons .new-request-submit:hover{
  background: var(--brand-color);
  border: 1px solid var(--brand-color);
  color: #ffffff;
  opacity: var(--hover-opacity);
}

/* Notes */
.new-request-notes p,
.new-request-notice p{
  margin: 0 0 1em 0;
}
.new-request-notes p:last-child,
.new-request-notice p:last-child{
  margin: 0 0 0 0;
}
.new-request-notes{
  margin: 1.5em 0 2em 0;
}
.new-request-notice{
  margin: 1.5em 0 2em 0;
}
.new-request-notes + .new-request-notice{
  margin-top: 0;
}

/* Confirm */
.new-request-form-confirm-list{
  border-top: 1px solid var(--border-color);
}
.new-request-form-confirm-item{
  display: flex;
  border-bottom: 1px solid var(--border-color);
  padding: 0.5em 0;
  align-items: flex-start;
  flex-direction: column;
}
.new-request-form-confirm-term{
  width: 100%;
  font-weight: bold;
}
.new-request-form-confirm-detail{
  width: 100%;
  padding: 0.5em 0 0 0;
  margin-inline-start: 0;
}

/* Complete */
.new-request-complete{
  text-align: center;
}
.new-request-complete .text{
  font-weight: bold;
  margin-bottom: 3em;
}
.new-request-complete .text .important{
  color: var(--accent-color);
}
.new-request-complete .hint{
}
.new-request-complete .buttons{
  display: flex;
  width: 100%;
  flex-direction: column;
  margin-top: 3em;
}
.new-request-complete .buttons .request-form-button{
  display: flex;
  height: 4em;
  margin-bottom: 1.2em;
  line-height: 1.2;
  margin-bottom: 1em;
  text-decoration: none;
}
.new-request-complete .buttons .request-form-button:visited{
  color: #ffffff;
  background-color: var(--brand-color);
}

/* Modal */
.new-request-modal {
  width: 90%;
}
.new-request-modal .new-request-modal-body{
  font-size: 1em;
  text-align: center;
}
.new-request-modal .new-request-modal-button-close{
  background: var(--brand-color);
  border: 1px solid var(--brand-color);
  color: #ffffff;
  font-weight: bold;
  width: 100%;
  margin: 0 auto;
}
.new-request-modal .new-request-modal-button-close:hover{
  background: var(--brand-color);
  border: 1px solid var(--brand-color);
  color: #ffffff;
  opacity: var(--hover-opacity);
}

@media (min-width: 768px) {
  /* Title */
  .new-request-title{
    font-size: 1.5em;
  }
  .new-request-title .icon img{
    height: 4.5em;
  }

  /* Steps */
  .new-request-steps .new-request-steps-item{
    height: 2em;
    line-height: 2em;
    font-size: 1em;
    padding: 0;
  }

  /* Form */
  .form{
    max-width: 75%;
  }

  /* Buttons */
  .request-form-buttons{
    flex-direction: row;
    justify-content: space-between;
    width: 100%;
  }
  .request-form-buttons .new-request-confirm{
    width: 60%;
  }
  .request-form-buttons .new-request-return{
    width: 48%;
    margin: 0 auto;
  }
  .request-form-buttons .new-request-submit{
    width: 48%;
    margin: 0 auto;
  }

  /* Confirm */
  .new-request-form-confirm-item{
    padding: 1em 0;
    flex-direction: row;
  }
  .new-request-form-confirm-term{
    width: 30%;
  }
  .new-request-form-confirm-detail{
    width: 70%;
    padding: 0 1em;
  }

  /* Complete */

  /* Modal */
  .new-request-modal {
    width: 90%;
    max-width: 30em;
  }
}

/* unique config */
.product-name + .product-version .request-field-headline{
  display: none;
}

/* Certificate Note */
/*------------------------------------*/
.print_page .header,
.print_page .footer{
  display: none;
}

.print_page_main{
  max-width: 794px;
  border: 1px solid #bbbbbb;
  margin: 30px auto;
  padding: 60px 15px;
  line-height: 1.8;
  position: relative;
}
.print_page_main:before{
  content: "";
  position: absolute;
  left: 3px;
  top: 3px;
  display: block;
  border: 3px solid #bbbbbb;
  width: calc(100% - 12px);
  height: calc(100% - 12px);
  pointer-events: none;
}
/**@page {
  margin: 0mm 5mm;
  size: A4 portrait; //横の場合はlandscape
}**/
@media print {
  .print_page #preview-bar-container{
    display: none;
  } 
  .print_page_main{
    /* border: 0;
    padding: 0; */
    margin: 0 auto;
  }
  #navbar-container {
    display: none;
  }
}

.certificate_note{
  text-align: center;
}
.certificate_note p{
  margin: 0;
  line-height: 1.8;
}
.certificate_note .image img{
  height: 120px;
  margin-bottom: 40px;
}
.certificate_note .title{
  margin-bottom: 40px;
}
.certificate_note .texts{
  margin-bottom: 40px;
  font-weight: bold; 
  font-family: serif;
  font-size: 14px;
}
.certificate_note .field{
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  margin-top: 0;
  margin-bottom: 25px;
}
.certificate_note .field dt,
.certificate_note .field dd{
  width: 50%;
  padding: 0;
  margin: 0 0 15px 0;
}
.certificate_note .field dt{
  text-align: right;
  font-weight: bold;
  font-family: serif;
}
.certificate_note .field dd{
  text-align: left;
}
.certificate_note .field dt:after{
  content: ":";
  margin: 0 5px;
}
.certificate_note .footernote{
  font-weight: bold;
  font-family: serif;
}