@charset "utf-8";

#wrapper {background: #fff;}

/*----------------------------------------------------------
	Free trial banner (above こんな経験はありませんか)
----------------------------------------------------------*/
.free-trial-banner { margin: 0; padding: 0 0 2rem; box-sizing: border-box; }
.free-trial-banner_inner {
  width: 100%;
  background: #fff;
  border-radius: 0;
  overflow: hidden;
  display: flex;
  flex-direction: row;
  box-shadow: 0 2px 16px rgba(0, 114, 151, 0.06);
  border: none;
  border-top: 1px solid rgba(0, 114, 151, 0.1);
  border-bottom: 1px solid rgba(0, 114, 151, 0.1);
}
.free-trial-banner_left {
  background: linear-gradient(135deg, #007297 0%, #005a75 100%);
  padding: 32px 36px;
  display: flex;
  align-items: center;
  gap: 28px;
  min-width: 380px;
}
.free-trial-banner_badge {
  flex-shrink: 0;
  width: 80px;
  height: 80px;
  background: rgba(255, 255, 255, 0.18);
  border-radius: 50%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  border: 1px solid rgba(255, 255, 255, 0.25);
}
.free-trial-banner_badge-line1 { font-size: 1rem; font-weight: 600; color: #fff; line-height: 1.1; letter-spacing: 0.02em; }
.free-trial-banner_badge-line2 { font-size: 1.75rem; font-weight: 700; color: #fff; line-height: 1.1; }
.free-trial-banner_left-txt { flex: 1; }
.free-trial-banner_left-txt1 { margin: 0; font-size: 17px; font-weight: 600; color: rgba(255, 255, 255, 0.95); line-height: 1.35; }
.free-trial-banner_left-txt2 { margin: 0.3rem 0 0; font-size: 26px; font-weight: 700; color: #fff; line-height: 1.25; letter-spacing: 0.02em; }
.free-trial-banner_right {
  background: #f8fafb;
  padding: 32px 28px;
  display: flex;
  justify-content: space-around;
  align-items: stretch;
  gap: 24px;
  flex: 1;
}
.free-trial-banner_circle {
  flex: 1;
  max-width: 220px;
  min-height: 110px;
  border-radius: 10px;
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px 20px;
  box-sizing: border-box;
  border: 1px solid rgba(0, 114, 151, 0.08);
  box-shadow: 0 1px 6px rgba(0, 0, 0, 0.04);
}
.free-trial-banner_circle-txt {
  font-size: 16px;
  line-height: 1.45;
  color: #333;
  text-align: center;
  font-weight: 500;
}

/*----------------------------------------------------------
	Styles for header
----------------------------------------------------------*/
.header_logo img {height: 40px;}
#header {text-align: center;}
.logo { margin-top: 110px;}
.logo img {width: 400px;}

/*----------------------------------------------------------
	Styles for try7
----------------------------------------------------------*/
.try7_block {width: 100%; margin: 0; display: flex; justify-content: center; align-items: center; }
.try7_left { background: #007297; flex: 1; font-size: 16px; color: #333; text-align: right;display: flex; justify-content:left; align-items: center; padding: 36px 24px; border-radius: 30px 0 0 30px ; margin: 20px 0; height: 70px; }
.try7_catch { font-size: 24px; font-weight: bold; color: #fff; text-align: center; line-height: 1.2; padding: 36px 24px; width: 70px; background-image: url(../img/try7_bg.png); background-repeat: no-repeat; background-position: center; background-size: 100%; }
.try7_catch2 { font-size: 22px; font-weight: bold; color: #fff; padding: 12px 10px;line-height: 1.2;; }
.try7_right { background: #fff; color: #007297; font-weight: bold; font-size: 20px; text-align: center; border-radius: 0 30px 30px 0; border:3px solid #007297; padding: 36px 20px; margin: 20px 0; height:64px; display: flex; justify-content: space-around; align-items: center; }
.try7_txt { font-size: 16px; line-height: 1.4; width: 120px; height:120px; text-align:center; background-image: url(../img/try7_bg2.png); background-repeat: no-repeat; background-position: center; background-size: 100%; padding-top: 80px; margin: 0 15px; }
.try7_chip_arrow { width: 0; height: 0; border-left: 12px solid transparent; border-right: 12px solid transparent; border-top: 20px solid #007297; margin: -20px auto 40px; }

#header {text-align: center;}
.logo { margin-top: 110px;}
.logo img {width: 400px;}

/*----------------------------------------------------------
	Styles for #main-visual
----------------------------------------------------------*/
#main-visual { position: relative; }
#main-visual h1 { color:#fff; font-size:46px; font-weight:bold; text-align:center; margin:0 0 40px; }
.main-visual_bg-style { border-bottom:2px solid #fff; max-height: 539px; overflow:hidden; }
.main-visual_notes { font-size:16px; }
.main-visual_play-btn { width:97px; margin:0 auto; }
.main-visual_txt { width:980px; position:absolute; margin:auto; left:0; right:0; top:160px; }
#main-visual_movie { position:absolute; top:0; right:0; width:100%; height:100%; display:block; }
.main-visual_movieWrap { display: block; overflow: hidden; position: relative; padding-bottom: 56.25%;}

/*----------------------------------------------------------
	Styles for #sub-main
----------------------------------------------------------*/
.sub-main_bg-style01 { background:#005976; padding:0px 0 0px; background-image: url(../img/outcom_bg.png); background-repeat: no-repeat; background-position: bottom; background-size: cover; }
.sub-main_head { color:#fff; font-weight:bold;}
.sub-main_head_img { width: 80px; margin: 0 auto ;}
.sub-main_caption {
  font-size: 24px;
  color: #6c757d;
  margin-bottom: 16px;
  line-height: 1.4;
  margin-left: 0;
  margin-top: 50px;
  text-shadow: none;
}
.sub-main_caption2 { font-size:26px; letter-spacing:2px; display:inline-block; margin:20px 0 -10px; text-shadow:0 1px 0 #000; line-height: 1.2; text-align: right; width: 530px;}
.sub-main_caption2 img {width: 100px; float: right; margin:-18px 0px 0 30px; }
.sub-main_lead {
  font-size: 56px;
  color: #212529;
  font-weight: 800;
  margin-bottom: 40px;
  line-height: 1.2;
  margin-left: 0;
}
.sub-main_logo img{width: 350px;}
.sub-main_bg-style01 { background:#005976; padding:0px 0 0px; background-image: url(../img/outcom_bg.png); background-repeat: no-repeat; background-position: bottom; background-size: cover; }

.sub-main_bg-style02 { background:#00546f; margin: -1px 0 0; }
.sub-main_feature { padding:34px 0px 32px; margin:0 -80px 0 0; }
.sub-main_box { color:#fff; font-weight:bold; width:230px; float:left; margin:0 42px 0 0; position:relative; }
.sub-main_ttl { font-size:30px; line-height:1.1; text-align:center; border-bottom:thin solid #fff; margin:0 0 14px; padding:0 0 14px; position:relative; z-index:1; }
.sub-main_txt { font-size:24px; text-align:center; letter-spacing:.8px; }
.sub-main_number01 { font-size:60px; font-family: Arial, Helvetica, sans-serif; font-weight:normal; }
.sub-main_box.first:after { content:url(../img/sub-main_icon01.png); position:absolute; top:18px; left:-34px; margin:0 0 0 16px; }
.sub-main_box.second:after { content:url(../img/sub-main_icon02.png); position:absolute; top:22px; left:-40px; margin:0 0 0 16px; }
.sub-main_box.third:after { content:url(../img/sub-main_icon03.png); position:absolute; top:22px; left:-10px; margin:0 0 0 16px; }
.sub-main_image { position:absolute; bottom:30px; right:0px; }

.sub-main_bg-style03 { background:#117599; color: #fff; text-align: center; padding: 40px 0;}
.sub-main_ttl_03 { font-size:30px; line-height:1.1; text-align:center; font-weight:bold; padding:0 0 14px; position:relative; z-index:1; }
.sub-main_number03 { font-size:90px; font-family: Arial, Helvetica, sans-serif; font-weight:bold; margin: 20px; line-height: 1; }
.style03_txt_30 { font-size:30px; }
.style03_txt_60 { font-size:60px;}
.style03_txt_120 { font-size:120px;}


.platform { width: 100px; margin: 10px 0 0;}
.platform_txt{font-size: 14px; text-align: center; line-height: 1.2; margin: 10px 0 40px}
.sub-main .inner{ background-image: url(../img/smp.png); background-repeat: no-repeat; background-position: right bottom; background-size:55%; padding: 50px 0; }
.alc{ background-image: url(../img/alc_face.png); background-repeat: no-repeat; background-position: left center; background-size:90px; padding: 0px 90px; color:#fff; font-weight:bold; font-size:22px; margin:0 0 0 50px; line-height: 1.3 }
.alc:before {
  content: "";
  display: inline-block;
  width: 32px;
  height: 32px;
  background: url(../img/alc_face.png) no-repeat center;
  background-size: contain;
  margin-right: 12px;
}
.sub-main .box { width:980px; margin: 0 auto; padding: 0; position:relative; }
.os{margin: 50px 0px;  color:#fff; font-size:14px; line-height: 1.3; }
.os img{ width: 120px; margin-bottom:0px;}

/* block02 */
.asked_block02 {
  background: #f8f9fa;
  padding: 100px 0;
  margin: 0;
  border-top: 1px solid #dee2e6;
  border-bottom: 1px solid #dee2e6;
}
.asked_block02.tablet { margin-top:-1px; }
.asked_block02_head {
  color: #212529;
  font-size: 40px;
  font-weight: 800;
  text-align: center;
  line-height: 1.4;
  margin-bottom: 60px;
}
.asked_block02_head_main { font-size:50px; display:inline-block; margin:0 0 32px; }

/* Modern Accordion Style for Beta */
.intro_asked_accordion .faq_box {
  width: 100%;
  max-width: 800px;
  margin: 0 auto 20px;
  background: #fff;
  border: 1px solid #dee2e6;
  border-radius: 12px;
  box-shadow: 0 4px 6px rgba(0,0,0,0.02);
  overflow: hidden;
  padding: 0;
}
.intro_asked_accordion .faq_box_ttl {
  font-size: 20px;
  padding: 24px 60px 24px 30px;
  background: #fff;
  border-bottom: none;
  margin: 0;
  transition: 0.2s;
  cursor: pointer;
  position: relative;
  color: #007297;
  font-weight: bold;
  line-height: 1.4;
}
.intro_asked_accordion .faq_box_ttl:hover {
  background: #f8f9fa;
}
.intro_asked_accordion .faq_box_ttl:after {
  content: '';
  display: block;
  position: absolute;
  right: 30px;
  top: 50%;
  transform: translateY(-50%);
  width: 0;
  height: 0;
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  border-top: 8px solid #007297;
  transition: transform 0.3s ease;
}
.intro_asked_accordion .faq_box_ttl.active:after {
  transform: translateY(-50%) rotate(180deg);
}
.intro_asked_accordion .faq_box_answer {
  padding: 0 30px 30px;
  background: #fff;
  display: none;
}

/*----------------------------------------------------------
	Styles for #voice
----------------------------------------------------------*/
.voice_bg-style { padding:20px 0 0; }
.voice_head { color:#01908c; font-size:40px; font-weight:bold; text-align:center; line-height:1.3; border:3px solid #01908c; padding:30px 0; margin:0 0 20px; position:relative; }
.voice_head:before { content: url(../img/voice_img01.png); position:absolute; top:0; left:0; }
.voice_list01 {border-bottom:3px solid #01908c; margin: 40px auto; padding: 20px 0 30px; width: 980px;}
.voice_list_ttl { color:#01908c; font-size:24px; font-weight:bold; margin:0 0 18px; }
.voice_list_txt { font-size:18px; width:750px; letter-spacing:1px; margin:0 0 12px; }
.voice_list_sign { font-size:20px; margin-bottom: 20px; }
.voice_list01_content { float:right; }
.voiceimg_left {width: 200px; float: left;}
.voiceimg_right {width: 200px; float: right;}
/*----------------------------------------------------------
	Styles for .cta
----------------------------------------------------------*/
.cta_bg-style { background:#ffdb00; border-top:8px solid #e4c400; padding:50px 0; }
.cta_head  { font-size:30px; font-weight:bold; text-align:center; margin:0 0 14px; letter-spacing:2px; }
.cta_head2  { font-size:30px; font-weight:bold; text-align:center; margin:0; letter-spacing:2px; color: #007297; }
.cta_btns { width:700px; margin:0 auto; }
.cta_btn_top { width:420px; }
.cta_gray-btn { float:left; width: 320px; background: url(../img/cta_btn02bg.png) no-repeat left top; margin-left: 50px;  }
.cta_red-btn { float:right; width: 320px; background: url(../img/cta_btn01bg.png) no-repeat left top; margin-right: 50px;  }
.cta_big-btn { width: 690px; background:transparent; margin:0 auto; overflow:hidden; border-radius:12px; }
.cta_big-btn a.cta_btn-red { display:block; width:100%; box-sizing:border-box; }
.cta_btn-red{background:#e7004f;
box-shadow: 0 4px 8px rgba(176, 176, 176, 0.5);
border-radius: 12px;color:#fff;
font-weight: bold;
font-size: 26px;
display: block;
text-align: center;
padding:25px 60px 25px 25px;
margin:0;
position: relative;
line-height: 1.4;
text-decoration: none;
transition: background-color 0.3s ease;
box-sizing:border-box;
}
.cta_btn-red:hover{background:#dc0442;}
.cta_btn-red i{color:#fff;position: absolute;
right:25px;top:50%;transform:translateY(-50%);font-size:28px;}
.cta_btn_note { font-size:0.95rem; color:#333; text-align:center; margin:1rem auto 0; padding:1.2rem; background:#fff; border:1px solid #ddd; border-radius:12px; width:690px; line-height:1.6; box-sizing:border-box; }
.cta_bg-style-last { background:#ffdb00; border-top:8px solid #e4c400; padding:30px 0; }
.cta_device { float:left; width:263px; margin-right:26px; position:relative; }
.cta_device_image { position:absolute; bottom:0; left:18px; }
.cta_price { background:#fff; font-weight:bold; border-radius:6px; padding:22px 16px 22px 22px; margin:0 0 20px; }
.cta_center-content { width:840px; margin: 0 auto; }
.cta_price_per { color:#fff; font-size:20px; background:#007297; padding:18px 30px; width:150px; text-align:center; line-height:1.2; position: relative; float:left; margin-right:25px; }
.cta_price_per:after { content:''; position:absolute; right:-9px; width: 0; height: 0; border-style: solid; border-width: 10px 0 10px 10px; border-color: transparent transparent transparent #007297; }
.cta_price_number { color:#ffdb00; font-size:36px; }
.cta_price_month { color:#007297; font-size:26px; font-weight:bold; float:left; line-height: 90px; padding-top: 5px; }
.cta_price_month > span:first-child { white-space: nowrap; }
.cta_price_month_span { color:#ec0044; font-size:48px; }
.cta_price_note { font-size:0.75rem; display:block; margin-top:0.3rem !important; margin-bottom:0 !important; line-height:1.3 !important; padding:0 !important; text-align:left; }
.cta_sub-head { color:#007297; font-weight:bold; font-size:26px; letter-spacing:2px; text-align:center; margin:0 0 30px; }
.cta_sub-head:before { content:url(../img/cta_img02.png); position:relative; left:-10px; top:3px; }
.cta_sub-head:after { content:url(../img/cta_img03.png); position:relative; right:-8px; top:3px; }

/*----------------------------------------------------------
	Styles for #asked
----------------------------------------------------------*/
.asked_block01 { color:#474a4e; background:#ebebeb; padding:40px 0; }
.asked_head { font-size:32px; font-weight:bold; text-align:center; background:#fff; border:5px solid #474a4e; padding:22px 0; margin:0 0 30px; letter-spacing:1px; }
.asked_list { width:310px; float:left; margin-right:24px; }
.asked_list:last-child { float:right; margin:0; }
.asked_list_icon { display:block; margin:0 auto 30px; }
.asked_list-ttl { font-size:28px; font-weight:bold; text-align:center; margin:0 0 22px; }
.asked_list-ttl:after { width:35px; margin:22px auto 0; content:''; display:block; border-bottom:4px solid #474a4e; }
.asked_list-txt { font-size:22px; font-weight:bold; }

/* block02 */
/*
.asked_block02 { background:url(../img/qa.jpg) no-repeat center; background-size: cover; padding:100px 0 138px; margin:-1px 0 0; }
.asked_block02.tablet { margin-top:-1px; }
.asked_block02_head { color:#fff; font-size:37px; font-weight:bold; text-align:center; line-height: 1.3; }
.asked_block02_head_main { font-size:50px; display:inline-block; margin:0 0 32px; }
*/
.asked_mark-question { font-size:40px; background:#999; width:108px; height:108px; line-height:108px; border-radius:60px; display:inline-block; font-family:Georgia, "Times New Roman", Times, serif; margin:0 14px 0 0; }

/* block03 */
.asked_block03 { width:930px; margin:45px auto 0; padding:0 0 28px; }
.accordion_btn { color:#fff; font-size:20px; font-weight:bold; letter-spacing:3px; width:740px; margin:0 auto; text-align:center; border-bottom:9px solid #c3033a; background:#ec0044; padding:26px 0; }
.accordion_btn:hover {background:#ff004a;}
.accordion_content { width:766px; margin:45px auto 0; padding:0 0 28px; }
.asked_block03_ttl { color:#ec0044; font-size:44px; font-weight:bold; background:#fff5f8; padding:30px 0 30px 30px; }
.asked_block03_a_txt { color:#555; font-size:22px; font-weight:bold; line-height:1; margin: -50px 0 0 108px; }
.asked_mark-answer { color:#fff; text-align:center; font-size:48px; background:#ec0044; width:108px; height:108px; line-height:108px; border-radius:60px; display:inline-block; font-family:Georgia, "Times New Roman", Times, serif; margin:0 6px 0 0; }
.asked_block03_box { width:766px; padding:38px 82px; margin: 0px auto;  background:url(../img/asked_img01.png) repeat-y; }
.asked_block03_box_txt { color:#555; font-size:26px; font-weight:bold; line-height:2; }
.asked_block03_box_span01 { color:#ec0044; font-size:44px; line-height: .9; }
.asked_block03_box_span02 { font-size:20px; }
.asked_block03_arrow { width:102px; margin:0 auto; }
.asked_block03_box_before { background:url(../img/asked_img02.png) no-repeat center; height:1px; margin-top: 28px; }
.asked_block03_box_after { background:url(../img/asked_img02.png) no-repeat center; height:1px; margin:0 0 28px; }

/*----------------------------------------------------------
	Styles for #training
----------------------------------------------------------*/
.training_bg-style { background:url(../img/training_img01.jpg) no-repeat 50% 0; padding:36px 0 32px; }
.training_head { color:#ffdb00; font-size:70px; font-weight:bold; margin:0 0 30px; letter-spacing:2px; }
.training_head_span { color:#fff; font-size:40px; display:inline-block; margin:0 0 30px; }
.training_txt { color:#fff; font-size:35px; font-weight:bold; line-height:1.4; border:3px solid #fff; width:640px; padding:24px 16px 24px 56px; }

/*----------------------------------------------------------
	Styles for #appli
----------------------------------------------------------*/
.appli_bg-style01 { background:#ffdb00; padding:30px 0 36px; }
.appli_head { color:#555555; font-size:48px; font-weight:bold; letter-spacing:4px; margin-left:306px; }
.appli_head_span { font-size:26px; display:inline-block; margin:0 0 20px; }
.appli_device { position: absolute; left:0; top:-8px; width: 275px; }
.appli_bg-style02 { background:#fff; padding:22px 0 30px; }
.appli_content { float:right; padding:20px 0 60px; width:670px; }
.appli_name { margin:0 0 6px; }
.appli_name_span { color:#fff; font-size:34px; margin:0 0 14px; display:inline-block; }
.appli_caption { font-size:42px; font-weight:bold; margin:0 0 36px; }
.appli_copy { width:610px; font-size:18px; }
.appli_caption_span { font-size:20px; display:inline-block; margin:0 0 20px; }
.appli .sub-main_box { color:#fff; font-weight:bold; width:310px; float:left; margin:0 42px 0 0; position:relative; }
.appli .sub-main_feature { margin:0 -80px 0 0; }
.appli_device_image { position:absolute; top:60px; left:16px; width: 240px; }
.appli_title { font-size:20px; margin:-20px 0 20px; color:#005976; text-align: center;}
/*----------------------------------------------------------
	Styles for #mypace
----------------------------------------------------------*/
#mypace .inner { padding:90px 0 0; height:602px; }
.mypace_bg-style { background:url(../img/mypace_bg01.jpg) no-repeat; position:relative; }
.mypace_head { color:#007297; font-size:50px; font-weight:bold; line-height:1.3; margin:0 0 50px; }
.mypace_head_span { color:#7a7b7c; font-size:37px; }
.mypace_pht { position:absolute; top:18px; right:-94px; }
.mypace_list { font-size:24px; font-weight:bold; line-height:1.3; padding:46px 0 74px; background:url(../img/mypace_img01.png) no-repeat; width:231px; text-align:center; }
.mypace_list:first-child { position:absolute; bottom:34px; right:310px; z-index:2; }
.mypace_list:nth-child(2) { position:absolute; bottom:120px; right:126px; z-index:1;  }
.mypace_list:nth-child(3) { position:absolute; bottom:34px; right:-50px; z-index:2; }
.mypace_list_image01 { display:block; width:29px; margin:0 auto 14px; }
.mypace_list_image02 { display:block; width:60px; margin:0 auto 0px; }
.mypace_list_image03 { display:block; width:33px; margin:0 auto 14px; }
.mypace_list_small { font-size:20px; }

/*----------------------------------------------------------
	Styles for #shortcut
----------------------------------------------------------*/
.shortcut_bg-style:after { margin:0 auto; right:0; left:0; top: auto; bottom:-72px; width: 0; height: 0; border-style: solid; border-width: 74px 300px 0 300px; border-color: #007297 transparent transparent transparent; content:''; position:absolute; }
.shortcut_bg-style { background:#007297 url(../img/shortcut_bg01.png) 50% 0 no-repeat; padding:80px 0 58px; position:relative; }
.shortcut_head { color:#fff; font-size:50px; font-weight:bold; text-align:center; text-shadow:0 1px 0 #000; margin:0 0 44px; }
.shortcut_head_span { color:#ffdb00; font-size:60px; }
.shortcut_box { background:#fff; padding:14px 14px 36px; }
.shortcut_before { background:#576466; padding:38px 0 0; position:relative; }
.shortcut_before:after { margin:0 auto; right:0; left:0; top: auto; bottom:-73px; width: 0; height: 0; border-style: solid; border-width: 74px 474px 0 474px; border-color: #576466 transparent transparent transparent; content:''; position:absolute; }
.shortcut_before.tablet:after { bottom:-72px; }
.shortcut_before_head { color:#fff; font-size:30px; font-weight:bold; text-align:center; line-height:1.3; letter-spacing:3px; border-bottom:thin solid #fff; width:290px; margin:0 auto 12px; padding:0 0 8px; }
.shortcut_before_txt { color:#fff; font-size:26px; font-weight:bold; text-align:center; line-height:1.8; letter-spacing:2px; margin:0 0 26px; }
.shortcut_ul { position:relative; }
.shortcut_before_caption { color:#fff; font-size:26px; text-align:center; font-weight:bold; }
.shortcut_list01 { width:184px; margin:0 0 0 80px; float:left; position:relative; z-index:1; }
.shortcut_list02 { width:419px; position:absolute; left:0; right:0; margin:0 auto; }
.shortcut_list03 { width:184px; margin:0 80px 0 0; float:right; position:relative; }
.shortcut_image { margin:0 0 10px; }
.shortcut_after { margin:100px 0 0; position:relative; }
.shortcut_after_head { color:#007297; font-size:46px; font-weight:bold; text-align:center; line-height:1.5; margin:0 0 20px; }
.shortcut_after_head_ruby { color:#007297; font-size:16px; font-weight:bold; position:absolute; top:-4px; left:260px; }
.shortcut_after_head_span01 { font-size:40px; }
.shortcut_after_head_span02 { font-size:30px; }
.shortcut_after_head_span03 { font-size:36px; }
.shortcut_after_caption { color:#007297; font-size:26px; text-align:center; font-weight:bold; }
.shortcut_footer_bg { background: url(../img/shortcut_bg02.jpg) no-repeat 50% 0; background-size:cover; padding:132px 0 84px; }
.shortcut_footer_box { background:rgba(237,27,84,0.80); filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#E6e01a51,endColorstr=#E6e01a51); border:thin solid #fff; width:900px; margin:0 auto; padding:70px 0 }
.shortcut_footer_copy { color:#fff; font-size:28px; font-weight:bold; line-height:1.8; margin:0 0 0 120px; }
.shortcut_footer_copy_span { font-size:50px; }

/*----------------------------------------------------------
	Styles for #reason
----------------------------------------------------------*/
.reason-inner { width:940px; margin:0 auto; position:relative; }
.reason_bg-style01 { background:url(../img/reason_bg01.jpg) 50% 0 no-repeat; padding:86px 0 0; }
.reason_bg-style02 { background:url(../img/reason_bg02.png) 50% 0 no-repeat; padding:66px 0 40px; }
.reason_bg-style03 { background:#fff; padding:60px 0 0; }
.reason_head { color:#fff; font-size:50px; font-weight:bold; text-align:center; line-height:1.5; margin:0 0 30px; }
.reason_head_span { font-size:40px; }
.reason_arrow { text-align:center; margin:0 0 54px; }
.reason_sub-head { color:#007297; font-size:50px; font-weight:bold; text-align:center; margin:0 0 50px; }
.reason_sub-head_span { font-size:100px; }
.reason_anchor li:hover { opacity:0.7; -moz-opacity:0.7; filter:alpha(opacity = 70); }
.reason_anchor_list { background:url(../img/reason_anchor.png) no-repeat; padding:26px 0 0; height:200px; width:290px; float:left; margin-right:32px; }
.reason_anchor_list:after { content:url(../img/reason_icon07.png); width:27px; margin:0 auto; display: block; }
.reason_anchor_icon { text-align:center; margin:0 0 8px; }
.reason_anchor_ttl { color:#ffdb00; font-size:28px; text-align:center; font-weight:bold; line-height:1.2; margin: 0 0 16px; }
.reason_anchor_number01 { font-size:50px; }
.reason_anchor { margin:0 -28px 0 0; }
.reason_block01, .reason_block02 { border:thin solid #00698b; border-radius:6px; margin:0 0 30px; }
.reason_block03 { border:thin solid #00698b; border-radius:6px; margin:0 0 30px; }
.reason_block_ttl { color:#fff; font-size:36px; font-weight:bold; background:#00698b; padding:20px 0 20px 54px; }
.reason_block_number { color:#fcd903; font-size:60px; font-weight:normal; font-family: Arial, Helvetica, sans-serif; }
.reason_block_img01 { float:left; margin-right:30px; }
.reason_block_img02 { float:right; margin-left:30px; }
.reason_block_content { padding:40px 30px; }
.reason_block_sub-ttl { font-size:26px; font-weight:bold; margin:0 0 24px; }
.reason_block_copy { line-height:1.8; }
.reason_block_icon { margin-right:18px; }
.reason_block_notes { font-size:12px; line-height:1.8; display:inline-block; }
.reason_block_strong {background-color: #fcd903;}

/*----------------------------------------------------------
    Styles for #why
----------------------------------------------------------*/
#why { padding:80px 0; }
#why .header { color:#007297; font-size:38px; font-weight:bold; text-align: center; border-bottom: 5px solid #007297; padding-bottom: 10px;}
.why_box {border: 5px solid #007297; padding: 0px; margin-top: 40px;}
.why_box_ttl {color:#007297; font-size:30px; font-weight:bold; text-align: left; background: #ffdb00; padding: 20px 10px ;}
.why_box_reason{color: #fff; font-weight: bold; font-size: 20px; background: #007297; border-radius: 20px; border:#007297;padding: 10px 20px; margin: 0px 20px 0 0; vertical-align: top; line-height: 30px;}
.why_box_inner1 {padding: 30px; background:url(../img/why1.png) no-repeat; background-position:top 40px right 10px; background-size: 300px;}
.why_box_inner2 {padding: 30px; background:url(../img/why2.png) no-repeat; background-position:center right 50px; background-size: 240px;}
.why_box_inner3 {padding: 30px; background:url(../img/why3.png) no-repeat; background-position:center right 20px; background-size: 300px;}
.why_box_inner_ttl{ font-size:26px; font-weight:bold; text-align: left; color:#007297;}
.why_box_inner_txt{padding-top: 30px; font-size:16px; text-align: left; line-height: 2; width: 620px;}
.txt_red{color:#ec0044; }
.why_box_inner_mb1 {margin-bottom: 2em;}

/*----------------------------------------------------------
    Styles for #step
----------------------------------------------------------*/
#step { padding:0 0 80px; }

.step_head_span01 { color: #fff; font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif; font-size: 100px; font-weight: lighter; float: left; margin-right:30px; }
.step_head_span02 { color:#fff; font-size:28px; font-weight:bold; margin:10px 0 10px; display:inline-block; }
.step_head_span03 { color:#ffdb00; font-size:38px; font-weight:bold; }
.step_head_span04 { float: left; }
.step_head-area { background: #007297; padding: 60px 0 120px; position: relative; z-index: 1; }
.step_head-area:after { background:rgba(0,0,0,0) url(../svg/separate3.svg); content: ""; display: block; height: 120px; position: absolute; width: 100%; background-size:100% 100%; padding:0 0 1px; }
.step_sub-head-area { background: #b3d8e6; position: relative; margin: 0 0 120px; padding:0 0 1px; }
.step_sub-head-area:after { background: url(../svg/separate2.svg); content: ""; background-repeat: no-repeat; display: block; height: 120px; position: absolute; width: 100%; background-size:100% 100%; }
.step_sub-head { color:#007297; font-size:42px; font-weight:bold; margin:0 0 0 340px; position:relative; z-index:1; }
.step_one { background:url(../img/step_img02.jpg) no-repeat 50% 0; min-height:481px; padding:0 0 122px; position:relative; }
.step_one:after { background: url(../svg/separate3.svg); content: ""; background-repeat: no-repeat; display: block; height: 120px; position: absolute; width: 100%; background-size:100% 100%; bottom:-1px; }
.step_one_device { position:absolute; top:-38px; z-index:1; margin-left:20px; width: 275px; }
.step_device_screen { position:absolute; top:58px; right:0; left:0; margin:auto; width: 240px; }
.step_copy_area { margin:-16px 0 0; }
.step_copy_txt { position:relative; z-index:2; float:right; width:450px; margin-top: 40px; margin-right: 160px;}
.step_copy_txt h4 { font-size:32px; font-weight:bold; margin:0 0 40px; }
.step_copy_txt_p { background:rgba(255,255,255,0.80); filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#CCffffff,endColorstr=#CCffffff); border:6px solid #007297; padding:30px 50px; line-height:2; }
.step_sub-head_step { color:#fff; font-size:40px; font-weight:bold; position:absolute; right:0; top:-82px; z-index:2; }
.step_sub-head_number { color:#fff; font-size:100px; font-weight:bold; position:absolute; right:0; top:0; z-index:2; line-height:.3; font-family: Arial, Helvetica, sans-serif;  }
.step_two { background:url(../img/step_img04.jpg) no-repeat 50% 0; min-height:466px; padding:0 0 136px; position:relative; margin:-2px 0 0; }
.step_two:after { background: url(../svg/separate3.svg); content: ""; background-repeat: no-repeat; display: block; height: 120px; position: absolute; width: 100%; background-size:100% 100%; bottom:0; }
.step_three { background:url(../img/step_img06.jpg) no-repeat 50% 0; min-height:500px; padding:0 0 120px; position:relative; margin:-2px 0 0; }
.step_movie_head { color:#fff; font-size:28px; font-weight:bold; text-align:center; background:#007297; padding:28px 0; }


/*----------------------------------------------------------
    Styles for #native
----------------------------------------------------------*/
.native_bg-sytle { border-top:20px solid #007297; border-bottom:20px solid #007297; padding:48px 0 50px; }
.native_head { font-size:44px; font-weight:bold; line-height:1.4; border-bottom:thin solid #007297; padding:0 0 30px; width:486px; margin:0 0 30px; }
.narive_copy { font-size:20px; line-height:2.1; width: 480px }
.native_left { float:left; }
.native_right { background:url(../img/native_img01.jpg) no-repeat; width:436px; height:343px; padding:6px 0 0; border:7px solid #007297; float:right; }
.native_right_text01 { color:#007297; font-size:20px; text-align:center; font-weight:bold; margin:0 0 14px; }
.native_right_text02 { color:#fff; font-size:30px; font-weight:bold; margin:0 0 0 30px; text-align: center; }
.native_right_text03 { color:#fff; font-size:18px; font-weight:bold; background:#fff; text-align:left; padding:10px; position:absolute; bottom:-10px; right: 0px; width:416px; border:7px solid #ed1b54; color: #ed1b54; }

/*----------------------------------------------------------
    Styles for #flashtraning
----------------------------------------------------------*/
.flashtraning_bg { padding:80px 0 72px; }
.flashtraning_head { font-size:40px; font-weight:bold; border-bottom:10px solid #79b2c5;  padding:0 0 40px 110px; margin:0 0 60px; position:relative; }
.flashtraning_head span{color:#ED1B54;}
.flashtraning_head:after { content: url(../img/outcom_img04.png); display:block; position:absolute; left:0; bottom:18px;opacity: 0.5; }

.flashtraning_box{display: flex;flex-wrap: wrap;justify-content: space-between;margin-bottom: 46px;}
.flashtraning_box_text{font-size: 24px;font-weight: bold;width: 540px;}
.flashtraning_box_text p{margin-bottom: 24px;}
.flashtraning_box_text span{color:#ED1B54;}
.flashtraning_image { width: 400px;}

.flashtraning_txt { width:594px; }
.flashtraning_copy {margin-top: 50px; color:#909090; line-height:1.8;font-size: 18px; }

/*----------------------------------------------------------
    Styles for #interview
----------------------------------------------------------*/
.interview_person01 { background: url(../img/interview_bg01.jpg) no-repeat 50% 0; height:300px; padding:40px 0 0; }
.interview_person02 { background: url(../img/interview_bg02.jpg) no-repeat 50% 0; height:300px; padding:40px 0 0; }
.interview_person03 { background: url(../img/interview_bg03.jpg) no-repeat 50% 0; height:300px; padding:40px 0 0; }
.interview_profile01 { color:#fff; background:rgba(0,114,151,0.80); padding:26px 36px; width:46%; float:right; filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#CC007297,endColorstr=#CC007297); }
.interview_profile02 { color:#fff; background:rgba(0,114,151,0.80); padding:26px 36px; width:46%; filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#CC007297,endColorstr=#CC007297); }
.intervie_ttl01 { font-size:30px; line-height:1.4; margin:0 0 6px; }
.interview_name { font-size:20px; }
.interview_txt { float:right; }
.interview_question { background:#f2f2f2; padding:40px 0 0; }
.interview_box { background:#fff; width:430px; padding:30px 18px; border-bottom:thin solid #c3c3c3; margin:0 0 40px; }
.interview_box:nth-child(even) { float:right; }
.interview_box:nth-child(odd) { float:left; }
.interview_box_ttl { color:#007297; font-size:22px; padding:0 0 16px 60px; line-height:1.4; background:url(../img/interview_icon01.png) no-repeat 0 10px; border-bottom:thin solid #007297; margin:0 0 22px; }
.interview_box_answer { line-height:1.8; }

/*----------------------------------------------------------
    Styles for #rule
----------------------------------------------------------*/
.rule_title-block { background:#007297; }
.rule_title { color:#fff; font-size:55px; font-weight:bold; text-shadow:0 -1px 0 #000; line-height:1.3; background:url(../img/rule_img01.png) no-repeat 0 50%; padding:36px 0 36px 100px; margin:0 0 0 250px; }
.rule_title_span01 { color:#ffdb00; font-size:40px; }
.rule_title_span02 { font-size:32px; }
.rule_block01 { padding:0; margin: 0 auto; width: 961px;}
.rule_list { color:#007297; font-size:35px; font-weight:bold; line-height:40px; margin:0 0px 60px; width: 260px; display: inline-block;  text-align: center; border:7px solid #007297; padding: 20px; }
.rule_list_block { padding:90px 0 50px; }
.rule_list_number { font-size:60px; font-weight:bold;  }
.rule_list_copy { display:inline-block; line-height:1.2; }
.rule_block01_image { position:absolute; top:10px; right:-136px; }
.rule_centerblock {margin: 0 10px;}

/*---------------------------------------------------------
    Styles for #continue
----------------------------------------------------------*/
.continue_bg-style { background:#f2f2f2; padding:0 0 50px; }
.continue_head { color:#007297; font-size:38px; font-weight:bold; text-align:center; background:#fff; border:8px solid #007297; padding:24px 0; line-height:1.5; position:relative; top:-40px; }
.continue_head:before { content:url(../img/continue_img01.png); position:absolute; top:0; left:0; }
.continue_head:after { content:url(../img/continue_img02.png); position:absolute; top:0; right:0; }
.continue_image { float:left; margin-right:36px; }
.continue_copy { font-size:20px; }
.continue_copy_span01 { font-size:25px; }
.continue_copy_span02 { color:#007297; font-size:30px; }

/*----------------------------------------------------------
    Styles for #outcom
----------------------------------------------------------*/
.outcome_bg { background:#007297 url(../img/outcom_bg.png) no-repeat 50% 0; padding:40px 0 72px; }
.outcom_ul { position:relative; margin:0 0 42px; }
.outcom_list01 { width:221px; height:221px; position:relative; float:left; margin:0 0 0 114px; }
.outcom_list02 { width:221px; height:221px; position: absolute; left:0; right:0; margin: auto; }
.outcom_list03 { width:221px; height:221px; position:relative; float:right; margin:0 114px 0 0; }
.outcom_ul figure { position:relative; }
.outcom_list_caption { color:#fff; font-size:36px; font-weight:bold; text-align:center; position:absolute; top:90px; right:0; left:0; }
.outcom_head { color:#fff; font-size:46px; font-weight:bold; border-bottom:10px solid #79b2c5; text-align:center; padding:0 0 50px; margin:0 0 60px; position:relative; }
.outcom_head:after { content: url(../img/outcom_img04.png); display:block; position:absolute; left:44px; bottom:18px; }
.outcom_head_span { color:#007297; font-size:30px; font-weight:bold; background:#ffdb00; padding:18px 0; letter-spacing:2px; display:block; width:460px; margin:0 auto; position:relative; }
.outcom_head_span:after { margin:0 auto; right:0; left:0; top: auto; bottom:-12px; width: 0; height: 0; border-style: solid; border-width: 12px 12px 0 12px; border-color: #ffdb00 transparent transparent transparent; content:''; position:absolute; }
.outcom_sub-head { color:#ffdb00; font-size:34px; font-weight:bold; line-height:1.6; margin:0 0 20px; }
.outcome_txt { width:594px; }
.outcom_copy { color:#fff; line-height:1.8; }
.outcome_image { position:absolute; bottom:-40px; right:0; }

/*----------------------------------------------------------
    Styles for #plan-intro
----------------------------------------------------------*/
#plan-intro { background: linear-gradient(180deg, #e8f4f8 0%, #f0f8fa 100%); padding: 2.5rem 0; }
.plan-intro_bg { background: transparent; }
.plan-intro_header { text-align: left; margin-bottom: 1.5rem; }
.plan-intro_title { font-size: 4rem; font-weight: bold; color: #007297; line-height: 1; margin: 0; letter-spacing: -0.02em; }
.plan-intro_subtitle { font-size: 1.6rem; color: #007297; font-weight: bold; margin: 0.3rem 0 0; position: relative; display: inline-block; }
.plan-intro_subtitle:after { content: ''; position: absolute; bottom: -0.2rem; left: 0; right: 0; height: 0.3rem; background: #ffdb00; }
.plan-intro_table_wrap { max-width: 100%; margin: 0 auto; }
.plan-intro_table { width: 100%; border-collapse: collapse; background: #fff; border-radius: 0.6rem; overflow: hidden; box-shadow: 0 2px 8px rgba(0,0,0,0.1); }
.plan-intro_table thead th { padding: 1.2rem 1.5rem; font-weight: bold; text-align: center; vertical-align: middle; }
.plan-intro_feature { background: #007297; color: #fff; text-align: left; font-size: 1.2rem; padding-left: 1.5rem; width: 40%; }
.plan-intro_free { background: #007297; color: #fff; font-size: 1.2rem; width: 30%; }
.plan-intro_paid { background: #033041; color: #fff; font-size: 1.2rem; width: 30%; }
.plan-intro_featur2 { color: #666; text-align: left; font-size: 0.8rem; padding-left: 1.5rem; width: 40%; }
.plan-intro_free2 { color: #666;  font-size: 0.8rem; width: 30%; }
.plan-intro_paid2 { background: #ffdb00; color: #007297; font-size: 0.8rem; width: 30%; font-weight: bold;}

.plan-intro_price { font-size: 0.95rem; display: block; margin-top: 0.2rem; line-height: 1.2; }
.plan-intro_price_span { font-size: 1.1rem; font-weight: bold; }
.plan-intro_price_note { font-size: 0.8rem; display: block; margin-top: 0.15rem; }
.plan-intro_price_note_small { font-size: 0.65rem; display: block; margin-top: 0.15rem; }
.plan-intro_table tbody tr:nth-child(odd) { background: #fff; }
.plan-intro_table tbody tr:nth-child(even) { background: #fffef0; }


.plan-intro_table tbody td { padding: 1.2rem 1.5rem; text-align: center; font-size: 1.1rem; border-top: 1px solid #e0e0e0; vertical-align: middle; }
.plan-intro_table tbody td.plan-intro_feature2 { text-align: left; color: #666; padding-left: 1.5rem; }
.plan-intro_table tbody td.plan-intro_free { color: #666; }
.plan-intro_table tbody td.plan-intro_paid { color: #007297; font-weight: bold; }
.plan-pricing_wrap { margin-top: 2.5rem; }
.plan-pricing_title { font-size: 2.2rem; color: #007297; font-weight: bold; text-align: center; margin: 0 0 2rem; position: relative; display: inline-block; width: 100%; }
.plan-pricing_title:after { content: ''; position: absolute; bottom: -0.3rem; left: 50%; transform: translateX(-50%); width: 40%; height: 0.3rem; background: #ffdb00; }
.plan-pricing_cards { display: flex; flex-direction: row; justify-content: space-between; gap: 1.5rem; max-width: 100%; margin: 0 auto; padding: 1rem 1rem 0; }
.plan-pricing_card { background: #fff; border-radius: 0.8rem; overflow: hidden; box-shadow: 0 2px 8px rgba(0,0,0,0.1); position: relative; flex: 1; max-width: 45%; }
.plan-pricing_card--recommended { border: 2px solid #ffdb00; border-radius: 0.8rem; overflow: visible; }
.plan-pricing_badge { position: absolute; top: -0.8rem; right: -0.8rem; background: #e7004f; color: #fff; font-size: 0.95rem; font-weight: bold; padding: 0.4rem 0.6rem; border-radius: 1rem; z-index: 9; border: 2px solid #fff; box-shadow: 0 2px 4px rgba(0,0,0,0.2); line-height: 1.2; text-align: center; }
.plan-pricing_banner { background: #ffaa00; color: #fff; font-size: 1.5rem; font-weight: bold; text-align: center; padding: 1rem 1.5rem; border-top-left-radius: 0.8rem; border-top-right-radius: 0.8rem; }
.plan-pricing_content { padding: 1.8rem 1.5rem; text-align: center; }
.plan-pricing_price { font-size: 2.4rem; font-weight: bold; color: #333; margin: 0 0 0.5rem; }
.plan-pricing_price--red { color: #e7004f; }
.plan-pricing_tax { font-size: 0.9rem; color: #999; margin: 0 0 0.5rem; }
.plan-pricing_year { font-size: 1.4rem; color: #333; margin: 0.5rem 0 0; font-weight: bold; }

/*----------------------------------------------------------
    Styles for #faq
----------------------------------------------------------*/
.faq_cotents {display: flex; justify-content: left; flex-wrap:wrap;}
.faq_bg-style { background:#f9f8ef; padding:80px 0 0; }
.faq_head { color:#007297; font-size:70px; font-weight:bold; text-align:center; margin:0 0 46px; }
.faq_box { background:#fff; width:430px; padding:30px 18px; border:thin solid #c3c3c3; margin:0 10px 30px; }
.faq_box_ttl { color:#007297; font-size:22px; padding:0 0 16px 60px; line-height:1.4; background:url(../img/interview_icon01.png) no-repeat 0 10px; border-bottom:thin solid #007297; margin:0 0 22px; cursor:pointer; position:relative; }
.faq_box_ttl.faq_accordion_trigger:after { content:''; display:block; position:absolute; right:0; top:50%; transform:translateY(-50%); width:0; height:0; border-left:8px solid transparent; border-right:8px solid transparent; border-top:8px solid #007297; transition:transform 0.3s ease; }
.faq_box_ttl.faq_accordion_trigger.active:after { transform:translateY(-50%) rotate(180deg); }
.faq_box_answer { display:none; }
.faq_box_answer_ttl { color:#ec0044; font-size:18px; padding:2px 0 0px 60px; background:url(../img/faq_icon01.png) no-repeat 10px 0px; background-size: auto; }
.faq_box_answer_copy { font-size:14px; line-height:1.8; }

#faq .faq_box_answer { display: block !important; }
#faq .faq_box_ttl.faq_accordion_trigger:after { display: none !important; }
#faq .faq_box_ttl { cursor: default; }

/*----------------------------------------------------------
    Styles for footer
----------------------------------------------------------*/
/*
#footer a { color:#888788; }
.footer_block-style01 { padding:20px 0; background:#eff0ef; }
.footer_block-style02 { padding:22px 0; background:#105f7d; }
.footer_nav { width:980px; text-align: center;}
.footer_nav_list { font-size:14px; font-weight:bold; background:url(../img/footer_img01.png) no-repeat 0 50%; background-size:.6rem; padding:0 0 0 15px; line-height:2.4; margin: 0 10px; display: inline-block; }
.footer_logo { position:absolute; bottom:10px; right:0; }
.footer_copyright { color:#fff; font-size:16px; text-align:center; display:block; }
*/

/*----------------------------------------------------------
	Styles for accordion
----------------------------------------------------------*/
.accordion_btn { position:relative; }
.accordion_btn:before { content: ' '; display: block; position: absolute; top: 0; right: 64px; height: 81px; width: 95px; }
.accordion_btn.active:before { content: ' '; display: block; position: absolute; top: 0; right: 64px; height: 81px; width: 95px; }
.accordion_btn:before { background:#c3033a url(../img/arrow_down.png) no-repeat; background-size: contain; }
.accordion_btn.active:before { background:#c3033a url(../img/arrow_up.png) no-repeat; background-size: contain; }
.accordion_btn:hover:before { background:#dc0442 url(../img/arrow_down.png) no-repeat; background-size: contain; }
.accordion_btn.active:hover:before { background:#dc0442 url(../img/arrow_up.png) no-repeat; background-size: contain; }

/*----------------------------------------------------------
    Styles for font-colors
----------------------------------------------------------*/
.yellow-shadow { color:#ffdb00; text-shadow:0 1px 0 #515151; }
.marker-yellow { background: linear-gradient(transparent 60%, #ffdb00 60%); background: -webkit-linear-gradient(transparent 60%, #ffdb00 0%); }
.font_red { font-size:28px; color:#ec0044; }
.font_yellow { color:#fcd903; }
.font_pink { color:#ed2258; }
.font-white { color:#fff; }

/*----------------------------------------------------------
    Styles for  (.kai)
----------------------------------------------------------*/
.kai {margin: 20px auto; font-size: 0.9rem; line-height: 1.4; max-width: 980px; text-align: center;}
.kai h2 { font-size: 20px; font-weight: bold; color:#005e7d; }
.kai table { margin: 50px 0; border-top: 1px solid #eee; width: 100%; }
.kai tr {text-align: left;  border-bottom: 1px solid #eee; }
.kai td {text-align: left;  padding: 10px 0; }
.name { width: 7rem;}
.name12 { width: 12rem;}
.name16 { width: 16rem;}
.cap{ margin: 50px 0; text-align: left; }
.kai ol {text-align: left; margin-bottom: 1em; line-height: 1.3; }
.kai li {margin-left: 2em; list-style-type: decimal; margin-bottom: 1em; }
.kai p {margin-bottom: 1em; }
.kai ol li ol{margin: 1em 0;}
.kai ol li ol li {margin: 1em 0 1em 2em; list-style-type: decimal; }
.kai ol li ol li ol li {margin: 1em 0 1em 2em; list-style-type: lower-roman; }
.mrl1{margin: auto 1em;}


.inp { border: #eee 1px solid; padding: 0 3px; width: -webkit-calc(100% - 10px); width: calc(100% - 10px); }
.txtinp2 { width: 2em; border: #eee 1px solid; padding: 0 3px;}
.txtinp4 { width: 4em; border: #eee 1px solid; padding: 0 3px;}
.txtinp7 { width: 7em; border: #eee 1px solid; padding: 0 3px;}


input[type="submit"] {
   background-color:#005e7d;
   border: none;
   border-radius: 20px;
   color: #fff;
   font-weight: bold;
   padding: 5px 20px;
   cursor: pointer;
}

input[type="submit"]:hover { background-color: #44CCF8; }
input[type="submit"]:active { background-color: #44CCF8; }

input[type="button"] {
   background-color:#005e7d;
   border: none;
   border-radius: 20px;
   color: #fff;
   font-weight: bold;
   padding: 5px 20px;
   cursor: pointer;
}

input[type="button"]:hover { background-color: #44CCF8; }
input[type="button"]:active { background-color: #44CCF8; }

.kai .good {border: #238fb3 solid 2px; padding: 20px; width: calc(100% - 44px); margin: 50px 0; color: #238fb3; text-align: center; line-height: 1.2; font-size: 18px; font-weight: bold; }

.ng {border: #cc0000 solid 2px; padding: 20px; width: calc(100% - 44px); margin: 50px 0 0; color: #cc0000; text-align: left; line-height: 1.2;}
.caption { font-size: 12px; line-height: 1; margin-top: 5px;}
.mt50{margin-top: 50px;}
.center{ text-align: center;}
.card {width: 400px;}

/*----------------------------------------------------------
	Styles for fotterPC
----------------------------------------------------------*/
#footer { font-size:0.8rem;}
#footer a { color:#888788; }
.footer_block-style01 { background:#eff0ef; padding:1rem;}
.footer_block-style02 { background:#105f7d; padding:1rem; font-family: Helvetica, Arial, sans-serif; }
.footer_nav_list { font-size:1rem; font-weight:bold; float:left; background:url(../img/footer_img01.png) no-repeat 0 50%; background-size:.6rem; padding:0 0 0 1rem; margin:0 .8rem 0 0; line-height:2; }
.footer_campany {margin:0; line-height:1.4; text-align: center; }
.footer_logo { width:23%; float:right; margin:0 1.3rem 0 0; }
.footer_copyright { color:#fff; text-align:center; display:block; }
#footer2 { font-size:1rem; }
#footer2 a { color:#888788; }
.bottom { position: fixed; bottom: 0;}



/*----------------------------------------------------------
    Styles for over 2000px screen
----------------------------------------------------------*/
@media (min-width: 2000px) {
	.reason_bg-style01, .reason_bg-style02 { background-size:contain; }
    .voice_list01, .voice_list02, .voice_list03, .asked_block02, .training_bg-style, .mypace_bg-style, .interview_person01, .interview_person02, .interview_person03, .outcome_bg, .shortcut_bg-style { background-size:cover; }
}
/*----------------------------------------------------------
    Styles for over 2100px screen
----------------------------------------------------------*/
@media (min-width: 2200px) {
	.shortcut_before:after { bottom:-73px; }
}

/*----------------------------------------------------------
	Styles for #sub-main (Modern Style)
----------------------------------------------------------*/
.sub-main_caption {
  color: #fff;
}
.sub-main_lead {
  color: #fff;
}
.alc {
  display: inline-flex;
  align-items: center;
  background: #fff;
  border: 1px solid #dee2e6;
  border-radius: 50px;
  padding: 12px 24px;
  color: #495057;
  font-size: 18px;
  font-weight: 600;
  box-shadow: 0 2px 4px rgba(0,0,0,0.05);
  margin-left: 0;
  background-image: none;
}
.alc:before {
  content: "";
  display: inline-block;
  width: 32px;
  height: 32px;
  background: url(../img/alc_face.png) no-repeat center;
  background-size: contain;
  margin-right: 12px;
}

/*----------------------------------------------------------
	Styles for #asked (Modern Style)
----------------------------------------------------------*/
/* block02 */
.asked_block02 {
  background: #f8f9fa;
  padding: 100px 0;
  margin: 0;
  border-top: 1px solid #dee2e6;
  border-bottom: 1px solid #dee2e6;
}
.asked_block02.tablet { margin-top:-1px; }
.asked_block02_head {
  color: #212529;
  font-size: 40px;
  font-weight: 800;
  text-align: center;
  line-height: 1.4;
  margin-bottom: 60px;
}
.asked_block02_head_main { font-size:50px; display:inline-block; margin:0 0 32px; }

/* Modern Accordion Style for Beta */
.intro_asked_accordion .faq_box {
  width: 100%;
  max-width: 800px;
  margin: 0 auto 20px;
  background: #fff;
  border: 1px solid #dee2e6;
  border-radius: 12px;
  box-shadow: 0 4px 6px rgba(0,0,0,0.02);
  overflow: hidden;
  padding: 0;
}
.intro_asked_accordion .faq_box_ttl {
  font-size: 20px;
  padding: 24px 60px 24px 30px;
  background: #fff;
  border-bottom: none;
  margin: 0;
  transition: background 0.2s;
  cursor: pointer;
  position: relative;
  color: #007297;
  font-weight: bold;
  line-height: 1.4;
}
.intro_asked_accordion .faq_box_ttl:hover {
  background: #f8f9fa;
}
.intro_asked_accordion .faq_box_ttl:after {
  content: '';
  display: block;
  position: absolute;
  right: 30px;
  top: 50%;
  transform: translateY(-50%);
  width: 0;
  height: 0;
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  border-top: 8px solid #007297;
  transition: transform 0.3s ease;
}
.intro_asked_accordion .faq_box_ttl.active:after {
  transform: translateY(-50%) rotate(180deg);
}
.intro_asked_accordion .faq_box_answer {
  padding: 0 30px 30px;
  background: #fff;
  display: none;
}
