@charset "utf-8";
@import url(https://fonts.googleapis.com/earlyaccess/notosansjp.css);

html{
  height: 100%;
}
body{
	font-family:'Noto Sans JP',"メイリオ", Meiryo, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "游ゴシック", YuGothic, "ＭＳ Ｐゴシック", sans-serif;
	height: 100%;
	margin: 0;
  line-height: 1.4;
  font-size: 1.3rem !important;
}

h1,h2,h3,p,ul,li{
	margin: 0;
  padding: 0;
  font-size: 1.3rem;
}
h2{font-size: 1.6rem;}
p{margin-bottom: 0 !important;}
img{
  max-width: 100%;
  margin: 0 auto;
}
.pc{display: block;}
.sp{display: none;}
.container, .container-lg, .container-md, .container-sm, .container-xl{
  width: 960px !important;
  max-width: 100% !important;
}
.container, .container-fluid, .container-lg, .container-md, .container-sm, .container-xl{
  padding: 0 !important;
}

.mt_1{margin-top: 1rem !important;}
.mt_11{margin-top: 1.1rem !important;}
.mt_12{margin-top: 1.2rem !important;}
.mt_13{margin-top: 1.3rem !important;}
.mt_14{margin-top: 1.4rem !important;}

.mb_0{margin-bottom: 0 !important;}
.mb_1{margin-bottom: 1rem !important;}
.mb_11{margin-bottom: 1.1rem !important;}
.mb_12{margin-bottom: 1.2rem !important;}
.mb_13{margin-bottom: 1.3rem !important;}
.mb_14{margin-bottom: 1.4rem !important;}
.mb_2{margin-bottom: 2rem !important;}
.mb_3{margin-bottom: 3rem !important;}
.mb_4{margin-bottom: 4rem !important;}
.mb_5{margin-bottom: 5rem !important;}

.fs_07{font-size: 0.7rem !important;}
.fs_08{font-size: 0.8rem !important;}
.fs_09{font-size: 0.9rem !important;}
.fs_1{font-size: 1rem !important;}
.fs_11{font-size: 1.1rem !important;}
.fs_12{font-size: 1.2rem !important;}
.fs_13{font-size: 1.3rem !important;}
.fs_14{font-size: 1.4rem !important;}
.fs_15{font-size: 1.5rem !important;}
.fs_16{font-size: 1.6rem !important;}
.fs_17{font-size: 1.7rem !important;}
.fs_18{font-size: 1.8rem !important;}
.fs_19{font-size: 1.9rem !important;}
.fs_20{font-size: 2rem !important;}

.fc_red{color: #f00;}
.err_msg{
  color: #f00;
  font-weight: bold;
}
.row{
  margin-top: 20px;
}
.container{
  width: 960px;
  margin: 0 auto;
}

.container_form{
  background-color: #f5f5f5;
  margin: 30px auto 20px;
  padding: 10px 0;
}
.container_form .inner{
  width: 960px;
  margin: 0 auto;
}

.upload_area{
  width: 860px;
  margin: 0 auto;
}
.sample_link{
  cursor: pointer;
}
.modal-content{
  background-color: rgba(0,0,0,0.7);
  color: #fff;
}
.close{
  color: #fff;
  opacity: 1;
}
.image_ex{
  display: flex;
  justify-content: space-around;
  margin-bottom: 1em;
}
.image_ex p{
  width: 46%;
}
.btn_sbumit input{
  width: 465px;
}
.btln{
  border: 1px solid #f00 !important;
  border-radius: 0 !important;
  font-size: 2.8rem !important;
  font-weight: bold;
  text-align: center;
}

.up_input{display: none !important;}
.up_area img{
  width: 465px;
  cursor: pointer;
}
.form-control{
  border: 2px solid #4a4a4a !important;
}

.kiyaku{
  width: 90%;
  height: 20rem;
  overflow-y: scroll;
  margin: 0 auto 20px auto;
  padding: 1rem;
  border: 1px solid #777;
}
.kiyaku h3,.kiyaku h4,.kiyaku p,.kiyaku ul,.kiyaku li{
  font-weight: normal !important;
  font-size: 1rem;
}
.kiyaku h3,.kiyaku h4{
  margin-top: 1rem;
}
.kiyaku ul{
  margin: 0 !important;
}
.kiyaku li{
  list-style-type: none;
}
.btn-next{
  background-color: #e71419 !important;
	border: none !important;
	color: #fff;
}
.btn-next:hover
, .btn-next:active
, .btn-next:focus{
	background-color: #d3011d !important;
	color: #fff;
}
.footer{
  margin-top: 3rem;
  background-color: #ff0;
  padding: 36px 0 46px 0;
  position: fixed;
  bottom: 0;
  width: 100%;
}
.footer_navi{
  width: 100%;
}
.footer img{
  width: 268px;
}
#footer{
  padding: 3rem 0 1rem;
}
.title {
  border: 2px solid #005BBB;
  color: #005BBB;
  text-align: center;
  font-size: 1.5rem;
  font-weight: bold;
  padding: 5px;
  margin: 10px 0 !important;
}
.vest_blue {
  color: #005BBB;
  text-align: center;
  font-weight: bold;
}
.spec_block {
  width: 90%;
  padding: 5px;
  margin: 0 auto;
  background-color: #ECECEC;
}
.inner {
  font-size: 1.2rem;
}
.underline {
  border-bottom: 2px solid #666 !important;
  padding-bottom: 0.5rem;
}
.required {
  background-color: #f00;
  color: #FFF;
  border-radius: 5px;
  padding: 5px 2.5px;
}
.footer_line {
  background-color: #005BBB;
  width:100%;
  height: 30px;
}

.elected_block {
  width: 90%;
  padding: 5px;
  margin: 0 auto;
  background-color: #edf3f9;
}

.spec_detail_block {
  background-color: #FFF;
  border: 1px solid #000;
  margin: 1rem;
  padding: 0.5rem;
}

/* ============================================================
   Display Contest 2nd Edition Styles (PC)
   ============================================================ */

/* --- LP --- */
.lp-section { max-width: 960px; margin-left: auto; margin-right: auto; }
.lp-outline-box { background-color: #e8f0f8; border-radius: 8px; color: #005BBB; }
.lp-section-title {
  color: #005BBB; font-weight: bold; font-size: 1.5rem;
  position: relative; overflow: hidden;
}
.lp-section-title span {
  display: inline-block; background-color: #e8f0f8; padding: 0 1.5rem; position: relative; z-index: 1;
}
.lp-section-title::before {
  content: ''; position: absolute; top: 50%; left: 0; right: 0;
  height: 1px; background-color: #005BBB; z-index: 0;
}
.lp-outline-table { --bs-table-color: #005BBB; color: #005BBB; }
.lp-outline-table th, .lp-outline-table td { color: #005BBB; }
.lp-outline-table th { white-space: nowrap; vertical-align: middle; padding-right: 1rem; width: 120px; }
.lp-outline-table td { vertical-align: middle; }
.lp-outline-table .lp-row-2col th { width: 120px; }
.lp-outline-table .lp-row-2col td { padding-right: 1.5rem; }
.lp-label {
  display: inline-block; border: 1.5px solid #005BBB; color: #005BBB;
  background-color: #fff;
  font-size: 0.9rem; padding: 3px 16px; border-radius: 999px; font-weight: bold;
  letter-spacing: 0.1em;
}
.lp-date-big {
  font-size: 1.4em; font-weight: bold; color: #005BBB;
  margin: 0 0.05em;
}
.lp-bordered-title {
  border: 2px solid #005BBB; border-radius: 8px; padding: 8px 16px;
}
.lp-bordered-title h2 { color: #005BBB; font-weight: bold; margin: 0; }
.lp-notice-box { background-color: #f9f9f9; border: 1px solid #ccc; border-radius: 6px; }
.lp-notice-box ul { padding-left: 1rem; }
.lp-notice-box li { font-size: 0.95rem; margin-bottom: 0.3rem; list-style-type: none; }
.lp-text-block { background-color: #f9f9f9; border-radius: 6px; }
.lp-text-block li { list-style-type: none; }
.lp-steps .lp-step { background-color: #f0f0f0; border-radius: 8px; }
.lp-step-num { color: #005BBB; font-weight: bold; font-size: 1.3rem; }

/* --- Buttons --- */
.btn-entry {
  background-color: #005BBB; color: #fff; font-weight: bold;
  font-size: 1.4rem; border-radius: 30px; border: none;
  padding: 12px 20px; text-decoration: none;
}
.btn-entry:hover, .btn-entry:active, .btn-entry:focus { background-color: #004a99; color: #fff; }
.btn-confirm {
  background-color: #e71419; color: #fff; font-weight: bold;
  font-size: 1.3rem; border-radius: 30px; border: none;
  padding: 12px 20px;
}
.btn-confirm:hover, .btn-confirm:active, .btn-confirm:focus { background-color: #c91015; color: #fff; }
.btn-submit {
  background-color: #e71419; color: #fff; font-weight: bold;
  font-size: 1.3rem; border-radius: 30px; border: none;
  padding: 12px 20px;
}
.btn-submit:hover, .btn-submit:active, .btn-submit:focus { background-color: #c91015; color: #fff; }

/* --- Form --- */
.form-page-title { color: #005BBB; font-weight: bold; }
.form-section { background-color: #f9f9f9; border-radius: 8px; padding: 20px; }
.form-section-title {
  color: #005BBB; font-weight: bold; font-size: 1.3rem;
  border-bottom: 2px solid #005BBB; padding-bottom: 8px; margin-bottom: 16px;
}
.form-group .form-label { margin-bottom: 4px; }

/* --- Confirm --- */
.confirm-section { background-color: #f9f9f9; border-radius: 8px; padding: 20px; }
.confirm-table th {
  width: 200px; vertical-align: top; font-weight: bold;
  background-color: #e8f0f8; border: 1px solid #ddd; padding: 8px 12px;
}
.confirm-table td { border: 1px solid #ddd; padding: 8px 12px; }

/* --- Course --- */
.course-card { border-radius: 8px; border: 2px solid #ddd; }
.course-card-title { font-weight: bold; font-size: 1.2rem; margin-bottom: 10px; }
.course-volume { border-color: #00b4d8; }
.course-idea { border-color: #e88090; }
.course-growth { border-color: #6cc070; }
.course-header-bar { border-radius: 8px; }
.course-header-bar.course-1 { background-color: #00b4d8; }
.course-header-bar.course-2 { background-color: #e88090; }
.course-header-bar.course-3 { background-color: #6cc070; }

/* --- Complete --- */
.complete-section { background-color: #f9f9f9; border-radius: 8px; }

/* --- Contact --- */
.lp-contact-box {
  background-color: #fff; color: #003c71; border-radius: 8px;
  max-width: 960px; margin-left: auto; margin-right: auto;
}
.lp-contact-box a { color: #003c71; text-decoration: none; }
.lp-contact-box a:hover { text-decoration: underline; }
.lp-contact-tel { font-size: 2.2rem; font-weight: bold; letter-spacing: 0.05em; }