@charset "utf-8";

#wrapper {background: #fff;}

/*----------------------------------------------------------
	Styles for header
----------------------------------------------------------*/
.header_logo img {height: 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 { color:#fff; font-weight:bold;font-size:26px; letter-spacing:2px; margin:0 0 26px; text-shadow:0 1px 0 #000; line-height: 1.2; margin-left: 50px;}
.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 { color:#fff; font-weight:bold; font-size:46px; margin:0 0 26px;  margin-left: 50px;}
.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:#005976; }

.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 center; 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: 90px }
.sub-main .box { width:980px; margin: 0 auto; padding: 0; position:relative; }
.os{margin: 50px;  color:#fff; font-size:14px; line-height: 1.3; }
.os img{ width: 120px; margin-bottom: 20px;}

/*----------------------------------------------------------
	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_list02 { }
.voice_list03 { }
.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_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: 20px;
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:22px;}
.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:50px 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 40px; }
.cta_center-content { width:840px; margin: 0 auto; }
.cta_price_per { color:#fff; font-size:24px; background:#007297; padding:18px 40px; width:170px; text-align:center; line-height:1.2; position: relative; float:left; margin-right:35px; }
.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:40px; }
.cta_price_month { color:#007297; font-size:30px; font-weight:bold; float:left; line-height: 90px; padding-top: 5px; }
.cta_price_month_span { color:#ec0044; font-size:55px; }
.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: #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;
}
.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 40px; background-size: 260px;}
.why_box_inner3 {padding: 30px; background:url(../img/why3.png) no-repeat; background-position:top 40px right 10px; 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 #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; }

/*----------------------------------------------------------
    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; }
.font_red_n { color:#f00; }

/*----------------------------------------------------------
    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;}
.txtinp12 { width: 12em; 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; }
}

/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Firefox */
input[type=number] {
  -moz-appearance: textfield;
}

.password-field {
position: relative;
}
.password-field input {
}
.password-field #toggler1 {
position: absolute;
right: 20px;
top: 50%;
transform: translateY(-50%);
cursor: pointer;
}
.password-field #toggler2 {
position: absolute;
right: 20px;
top: 50%;
transform: translateY(-50%);
cursor: pointer;
}