@charset "utf-8";
/* 2015.01.05 R.Yoshikawa */
/**-----------------------------------------------
LESS
-----------------------------------------------**/
@font-face {
  font-family: 'Noto Sans JP';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/notosansjp/v40/-F6pfjtqLzI2JPCgQBnw7HFQaioq1A.otf) format('opentype');
}
@font-face {
  font-family: 'Noto Sans JP';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/notosansjp/v40/-F6pfjtqLzI2JPCgQBnw7HFQMisq1A.otf) format('opentype');
}
@font-face {
  font-family: 'M PLUS Rounded 1c';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(https://fonts.gstatic.com/s/mplusrounded1c/v13/VdGBAYIAV6gnpUpoWwNkYvrugw9RuM064ZsK.ttf) format('truetype');
}
.font_Awesome {
  display: inline-block;
  font-family: "Font Awesome 5 Free";
}
.a_text a {
  color: #333333;
  text-decoration: none;
}
.a_text a:hover {
  opacity: 0.6;
}
.btn_common {
  display: inline-block;
  position: relative;
  min-width: 250px;
  padding: 10px 50px 10px 40px;
  text-align: center;
  color: #FFF;
  font-size: 1.25rem;
  font-family: 'M PLUS Rounded 1c', sans-serif;
  background-color: #305088;
  border-radius: 50px;
}
.btn_common::before,
.btn_common::after {
  position: absolute;
  top: 0;
  bottom: 0;
  right: 20px;
  margin: auto;
  content: "";
  vertical-align: middle;
}
.btn_common::before {
  width: 15px;
  height: 2px;
  background: #FFF;
}
.btn_common::after {
  width: 8px;
  height: 8px;
  border-top: 2px solid #FFF;
  border-right: 2px solid #FFF;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}
.text_webkit {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
}
.text_left {
  text-align: left !important;
}
.text_right {
  text-align: right !important;
}
/**-----------------------------------------------
基本
-----------------------------------------------**/
* {
  box-sizing: border-box;
}
html {
  font-size: 16px;
}
@media screen and (max-width: 480px) {
  html {
    font-size: 14px;
  }
}
body {
  color: #333333;
  font-family: 'Noto Sans JP', Meiryo, sans-serif;
  font-style: normal;
  font-weight: 300;
  margin: 0;
  padding: 0;
  background-color: #F2F2F2;
}
.sp {
  display: none;
}
@media screen and (max-width: 480px) {
  .pc {
    display: none;
  }
  .sp {
    display: block;
  }
}
img {
  max-width: 100%;
  height: auto;
}
/**-----------------------------------------------
リンク色
-----------------------------------------------**/
a {
  /*リンクされた文字*/
  color: #003399;
  font-style: normal;
  text-decoration: underline;
  transition: 0.3s;
}
a:link {
  /*未訪問のリンク*/
  color: #003399;
  font-style: normal;
  text-decoration: underline;
}
a:visited {
  /*訪問後のリンク*/
  color: #003399;
  text-decoration: underline;
}
a:hover {
  /*マウスをのせたとき*/
  font-style: normal;
  text-decoration: none;
  opacity: 0.6;
}
a:active {
  /*クリック中*/
  text-decoration: none;
}
/**-----------------------------------------------
汎用
-----------------------------------------------**/
/* フォントサイズ */
.parts_fs_xxl {
  font-size: 2rem;
}
.parts_fs_xl {
  font-size: 1.375rem;
}
.parts_fs_lg {
  font-size: 1.125rem;
}
.parts_fs_md {
  font-size: 1rem;
}
.parts_fs_xs {
  font-size: 0.75rem;
}
.parts_fc_sub {
  color: #003399;
}
.parts_ff {
  font-family: 'M PLUS Rounded 1c', sans-serif;
}
.parts_fontb {
  font-weight: bold;
}
/* 見出し */
.title_default {
  max-width: 600px;
  margin: 0 auto;
  margin-bottom: 20px;
}
.title_xxl {
  max-width: 600px;
  margin: 0 auto;
  margin-bottom: 20px;
  position: relative;
  font-size: 1.437rem;
  text-align: center;
  padding: 10px 5% 15px;
}
.title_xxl:before {
  display: block;
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  margin: 0 auto;
  width: 50px;
  height: 2px;
  background-color: #333333;
  border-radius: 10px;
}
.title_xl {
  max-width: 600px;
  margin: 0 auto;
  margin-bottom: 20px;
  font-size: 1.125rem;
  color: #FFF;
  padding: 10px 5%;
  background-color: #B3B3B3;
}
.title_lg {
  max-width: 600px;
  margin: 0 auto;
  margin-bottom: 20px;
  position: relative;
  font-size: 1rem;
  padding: 5px 5% 5px 8%;
}
.title_lg:before {
  display: block;
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 5%;
  width: 3px;
  background-color: #333333;
  border-radius: 10px;
}
.title_md {
  max-width: 600px;
  margin: 0 auto;
  margin-bottom: 20px;
  font-size: 0.812rem;
  padding: 10px 5%;
  color: #4D4D4D;
  background-color: #CCC;
}
.title_xs {
  font-size: 0.625rem;
  padding: 0 5%;
  margin-bottom: 10px;
  color: #ff99ff;
}
/* 枠線 */
.parts_border {
  padding: 10px;
  background-color: #FFF;
  border: 1px solid #333333;
}
/* 補足 */
.parts_info {
  font-size: 0.75rem;
  color: #B3B3B3;
}
/* 横並び */
.parts_flex {
  display: flex;
  flex-wrap: wrap;
}
.parts_flex_2 {
  display: flex;
  flex-wrap: wrap;
}
.parts_flex_2 > * {
  width: calc(50% - 10px);
  margin-right: 20px;
}
.parts_flex_2 > *:nth-child(2n) {
  margin-right: 0;
}
.parts_flex_2 > *:nth-child(n+3) {
  margin-top: 20px;
}
.parts_flex_3 {
  display: flex;
  flex-wrap: wrap;
}
.parts_flex_3 > * {
  width: calc((100% / 3) - 6px);
  margin-right: 9px;
}
.parts_flex_3 > *:nth-child(3n) {
  margin-right: 0;
}
.parts_flex_3 > *:nth-child(n+4) {
  margin-top: 20px;
}
/* コピー */
.parts_copy {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
}
.parts_copy input {
  width: calc(100% - 90px);
}
.parts_copy div {
  width: 80px;
}
.parts_copy div a {
  width: 100%;
}
/* ボタン */
.btn a {
  color: #333333;
  text-decoration: none;
}
.btn a:hover {
  opacity: 0.6;
}
.btn a {
  display: inline-block;
  position: relative;
  min-width: 250px;
  padding: 10px 50px 10px 40px;
  text-align: center;
  color: #FFF;
  font-size: 1.25rem;
  font-family: 'M PLUS Rounded 1c', sans-serif;
  background-color: #305088;
  border-radius: 50px;
}
.btn a::before,
.btn a::after {
  position: absolute;
  top: 0;
  bottom: 0;
  right: 20px;
  margin: auto;
  content: "";
  vertical-align: middle;
}
.btn a::before {
  width: 15px;
  height: 2px;
  background: #FFF;
}
.btn a::after {
  width: 8px;
  height: 8px;
  border-top: 2px solid #FFF;
  border-right: 2px solid #FFF;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}
/* ボタン(フォーム) */
.btn_button {
  display: flex;
  justify-content: center;
}
.btn_button button {
  display: inline-block;
  position: relative;
  min-width: 250px;
  padding: 10px 50px 10px 40px;
  text-align: center;
  font-size: 1.25rem;
  font-family: 'M PLUS Rounded 1c', sans-serif;
  background-color: #305088;
  border-radius: 50px;
  border: none;
  cursor: pointer;
  line-height: 1.2;
  margin-right: 20px;
  color: #FFF;
}
.btn_button button::before,
.btn_button button::after {
  position: absolute;
  top: 0;
  bottom: 0;
  right: 20px;
  margin: auto;
  content: "";
  vertical-align: middle;
}
.btn_button button::before {
  width: 15px;
  height: 2px;
  background: #FFF;
}
.btn_button button::after {
  width: 8px;
  height: 8px;
  border-top: 2px solid #FFF;
  border-right: 2px solid #FFF;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}
@media screen and (max-width: 1024px) {
  .btn_button button {
    -webkit-appearance: none;
  }
}
.btn_button button:last-child {
  margin-right: 0;
}
.btn_button button.prev:before {
  content: "\f053";
  right: auto;
  left: 20px;
}
@media screen and (max-width: 480px) {
  .btn_button_2 button {
    font-size: 1rem;
    min-width: calc(50% - 10px);
  }
}
/* ボタン(小) */
.btn_xs {
  font-size: 0.75rem;
}
.btn_xs a {
  color: #333333;
  text-decoration: none;
}
.btn_xs a:hover {
  opacity: 0.6;
}
.btn_xs > * {
  display: inline-block;
  position: relative;
  padding: 8px 20px;
  text-align: center;
  color: #FFF;
  font-family: 'M PLUS Rounded 1c', sans-serif;
  background-color: #0abab5;
  border-radius: 5px;
}
.btn_xs a {
  color: #FFF;
}
/* テーブル */
.table_style {
  border-collapse: collapse;
  /* width:100%はみ出し防止 */
  -webkit-box-sizing: border-box;
  -khtml-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
  /* テーブルのはみ出し防止 */
  word-break: break-all;
}
.table_style th {
  padding: 10px 20px;
  text-align: left;
  font-weight: normal;
  vertical-align: middle;
  border: 1px solid #DDD;
  background-color: #F9F9F9;
}
.table_style td {
  padding: 10px 20px;
  vertical-align: middle;
  border: 1px solid #DDD;
  background-color: #FFF;
}
@media screen and (max-width: 480px) {
  .table_style.table_vertical {
    display: block;
  }
  .table_style.table_vertical tbody,
  .table_style.table_vertical tr,
  .table_style.table_vertical th,
  .table_style.table_vertical td {
    display: block;
  }
  .table_style.table_vertical tr:first-child th {
    border-top: 1px solid #DDD;
  }
  .table_style.table_vertical th {
    padding: 10px;
    border-top: none;
    border-bottom: none;
  }
  .table_style.table_vertical td {
    padding: 10px;
  }
}
@media screen and (max-width: 480px) {
  /* 横にスライドさせる */
  .table_side .table_style {
    display: block;
    overflow-x: scroll;
    white-space: nowrap;
    -webkit-overflow-scrolling: touch;
  }
}
/* コンテンツスクロール */
.parts_content_scroll {
  overflow-y: scroll;
  padding: 10px;
  height: 150px;
  border: 1px solid #B3B3B3;
  background-color: #FFF;
}
/* 戻る */
.parts_prev {
  margin-bottom: 20px;
}
.parts_prev a {
  color: #333333;
  text-decoration: none;
}
.parts_prev a:hover {
  opacity: 0.6;
}
.parts_prev a {
  display: flex;
  color: #4D4D4D;
  display: inline-block;
  text-align: center;
  font-weight: bold;
  padding: 5px;
  border: 1px solid #4D4D4D;
  border-radius: 5px;
}
.parts_prev a:before {
  display: inline-block;
  font-family: "Font Awesome 5 Free";
  content: "\f0e2";
  margin-right: 5px;
}
/* ページ送り */
.pagination ul {
  display: flex;
  justify-content: center;
}
.pagination li {
  font-size: 0.8rem;
  margin: 0 10px 10px 0;
}
.pagination li a,
.pagination li span {
  display: block;
  color: #3B2E25;
  padding: 5px 10px;
  text-decoration: none;
  border-radius: 5px;
}
.pagination li span {
  color: #FFF;
  border: 1px solid #3B2E25;
  background-color: #3B2E25;
}
.pagination li a {
  border: 1px solid #0abab5;
}
/* ol */
.ol_list {
  margin: 10px 0 10px 30px;
}
.ol_list li {
  list-style-type: decimal;
  line-height: 1.6;
  margin-bottom: 10px;
}
.ol_list li ol,
.ol_list li ul {
  margin-left: 20px;
}
.ol_list li ol li,
.ol_list li ul li {
  margin-bottom: 0;
  font-size: 0.9rem;
}
/* ul */
.ul_list {
  margin: 10px 0 10px 30px;
}
.ul_list li {
  list-style-type: disc;
  line-height: 1.6;
  margin-bottom: 10px;
}
/* dl */
.dl_list {
  margin-bottom: 20px;
}
.dl_list dt {
  color: #0abab5;
  font-size: 1.1rem;
}
.dl_list dd {
  margin: 0 1em;
}
@media screen and (max-width: 480px) {
  .dl_list dd {
    margin: 0 5%;
  }
}
/* メニュー */
.parts_menu {
  max-width: 600px;
  margin: 0 auto;
}
.parts_menu li {
  border-bottom: 1px solid #B3B3B3;
}
.parts_menu li a {
  color: #333333;
  text-decoration: none;
}
.parts_menu li a:hover {
  opacity: 0.6;
}
.parts_menu li a {
  display: block;
  padding: 15px 5%;
}
/**-----------------------------------------------
フォーム
-----------------------------------------------**/
input,
select {
  width: 100%;
  max-width: 600px;
  padding: 10px;
  font-size: 1rem;
  font-family: 'Noto Sans JP', Meiryo, sans-serif;
}
textarea {
  width: 100%;
  padding: 10px;
  min-height: 150px;
  font-size: 1rem;
  font-family: 'Noto Sans JP', Meiryo, sans-serif;
}
/*
label input[type="radio"],
label input[type="checkbox"] {
	margin-right:10px;
}
*/
/* チェックボックス */
.parts_checkbox {
  margin-right: 20px;
}
.parts_checkbox input {
  display: none;
}
.parts_checkbox input:checked + span:after {
  content: "";
  display: block;
  position: absolute;
  top: 3px;
  left: 7px;
  width: 4px;
  height: 8px;
  transform: rotate(40deg);
  border-bottom: 2px solid #0abab5;
  border-right: 2px solid #0abab5;
}
.parts_checkbox span {
  padding-left: 25px;
  position: relative;
}
.parts_checkbox span:before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 15px;
  height: 15px;
  border: 2px solid #0abab5;
  border-radius: 4px;
}
/* ラジオボタン */
.parts_radio {
  margin-right: 20px;
}
.parts_radio input {
  display: none;
}
.parts_radio input:checked + span:after {
  content: "";
  display: block;
  position: absolute;
  top: 5px;
  left: 5px;
  width: 9px;
  height: 9px;
  background: #0abab5;
  border-radius: 50%;
}
.parts_radio span {
  padding-left: 25px;
  position: relative;
}
.parts_radio span:before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 15px;
  height: 15px;
  border: 2px solid #0abab5;
  border-radius: 50%;
}
/* ファイル添付 */
.parts_file label {
  display: block;
  position: relative;
  border: 3px dashed #B3B3B3;
  font-size: 1.125rem;
  font-weight: bold;
  text-align: center;
  padding: 20px;
  margin: 0 20px 10px;
  border-radius: 10px;
}
.parts_file label:before {
  display: inline-block;
  font-family: "Font Awesome 5 Free";
  display: block;
  content: "\f0c6";
  color: #B3B3B3;
  font-size: 2.5rem;
  margin-bottom: 20px;
}
.parts_file input {
  position: absolute;
  left: 0;
  top: 0;
  opacity: 0;
  width: 100%;
  height: 100%;
}
.parts_file span {
  display: block;
  text-align: center;
}
/**-----------------------------------------------
ヘッダー
-----------------------------------------------**/
#header {
  line-height: 1.2;
  margin-bottom: 20px;
}
#header .logo {
  width: 40%;
  margin: 10px auto;
  text-align: center;
}
.head_title {
  color: #FFF;
  text-align: center;
  padding: 12px 5px;
  font-size: 1.375rem;
  font-weight: bold;
  font-family: 'M PLUS Rounded 1c', sans-serif;
  background-color: #0abab5;
}
.page_title {
  color: #FFF;
  padding: 8px 5%;
  font-size: 1.125rem;
  font-weight: bold;
  font-family: 'M PLUS Rounded 1c', sans-serif;
  background-color: #ff99ff;
}
/**-----------------------------------------------
メインエリア
-----------------------------------------------**/
#content {
  line-height: 1.2;
  margin-bottom: 80px;
}
#content p {
  line-height: 1.4;
}
.section {
  max-width: 600px;
  margin: 0 auto;
}
@media screen and (max-width: 1024px) {
  .section {
    width: auto;
    padding-left: 40px !important;
    padding-right: 40px !important;
  }
}
@media screen and (max-width: 480px) {
  .section {
    padding-left: 5% !important;
    padding-right: 5% !important;
  }
}
.section_margin {
  margin-bottom: 50px;
}
/* メニュー */
#nav {
  position: fixed;
  z-index: 999;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #000;
}
#nav ul {
  display: flex;
  height: 60px;
}
#nav li {
  width: calc(100% / 3);
  text-align: center;
  border-right: 1px solid #FFF;
}
#nav li:last-child {
  border: none;
}
#nav li a {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  width: 100%;
  height: 100%;
  color: #FFF;
  text-decoration: none;
}
#nav li span {
  display: block;
  font-size: 0.875rem;
  margin-top: 5px;
}
.page_top .menu_top,
.page_cash .menu_cash,
.page_mypage .menu_mypage {
  background-color: #0abab5;
}
/**-----------------------------------------------
ログイン
-----------------------------------------------**/
.login {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-top: 100px;
}
/**-----------------------------------------------
新規会員登録
-----------------------------------------------**/
.flex_date {
  flex-wrap: initial;
  align-items: center;
}
/**-----------------------------------------------
アンケート一覧
-----------------------------------------------**/
.questionary_list {
  max-width: 600px;
  margin: 0 auto;
  padding: 2%;
}
.questionary_list li {
  margin-bottom: 40px;
}
.questionary_list .closing {
  text-align: right;
  color: #003399;
  font-size: 1rem;
  font-weight: bold;
  margin-bottom: 5px;
}
.questionary_list .closing:before {
  display: inline-block;
  font-family: "Font Awesome 5 Free";
  content: "\f303";
}
.questionary_list .detail {
  position: relative;
  padding: 20px;
  background-color: #FFF;
  border-radius: 5px;
}
.questionary_list .detail .img {
  display: flex;
  align-items: center;
  margin-bottom: 10px;
}
.questionary_list .detail .img figure {
  width: calc(50% - 10px);
  margin-right: 20px;
}
.questionary_list .detail .img figure:last-child {
  margin-right: 0;
}
.questionary_list .detail .point {
  position: absolute;
  top: 10px;
  left: -5px;
  padding: 8px 20px;
  min-width: 60px;
  font-size: 0.937rem;
  font-weight: bold;
  color: #FFF;
  background-color: #FFCCFF;
  border-radius: 0 5px 5px 0 ;
}
.questionary_list .detail .point:before {
  position: absolute;
  content: "";
  top: 100%;
  left: 0;
  border-bottom: solid 5px transparent;
  border-right: solid 5px #FF99FF;
}
.questionary_list .detail a {
  display: block;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
}
/**-----------------------------------------------
アンケート詳細
-----------------------------------------------**/
.questionary_select input {
  display: none;
}
.questionary_select input:checked + figure {
  position: relative;
}
.questionary_select input:checked + figure:after {
  content: "★";
  display: block;
  position: absolute;
  top: -2px;
  right: 5px;
  width: 30px;
  height: 15px;
  padding-top: 5px;
  color: #FFF;
  font-size: 16px;
  text-align: center;
  background: #ff99ff;
}
.questionary_select input:checked + figure:before {
  display: block;
  content: "";
  position: absolute;
  top: 12px;
  right: 5px;
  border-top: 15px solid #ff99ff;
  border-bottom: 15px solid transparent;
  border-right: 15px solid #ff99ff;
  border-left: 15px solid #ff99ff;
}
/**-----------------------------------------------
講義検索
-----------------------------------------------**/
/**-----------------------------------------------
法人・団体の方へ
-----------------------------------------------**/
/**-----------------------------------------------
お問い合わせ
-----------------------------------------------**/
.form_area dl {
  margin-bottom: 20px;
}
.form_area dt {
  font-size: 1.125rem;
  font-weight: bold;
  margin-bottom: 10px;
}
.form_area dt .required {
  display: inline-block;
  color: #FFF;
  margin-left: 20px;
  padding: 0 10px;
  font-size: 0.8rem;
  background-color: #0abab5;
}
.form_area dt.parts_flex {
  align-items: center;
  justify-content: space-between;
}
.form_area .btn_button {
  justify-content: flex-end;
}
/**-----------------------------------------------
モーダル
-----------------------------------------------**/
/* モーダルウィンドウ全体のレイアウト（画面いっぱいに表示） */
.c-modal {
  display: none;
  height: 100vh;
  position: fixed;
  width: 100%;
  top: 0;
  left: 0;
  z-index: 99999;
}
/* 黒背景の設定 */
.c-modal_bg {
  background: rgba(0, 0, 0, 0.6);
  height: 100vh;
  width: 100%;
}
/* ウィンドウの設定*/
.c-modal_content {
  background: #fff;
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  border-radius: 10px;
  width: 80%;
  padding: 50px;
}
@media screen and (max-width: 480px) {
  .c-modal_content {
    width: 90%;
    padding: 50px 5% 30px;
  }
}
/* 閉じるボタン*/
.c-modal_close {
  position: absolute;
  top: 10px;
  right: 20px;
  font-size: 20px;
}
/* コンテンツの中身 */
.modal_area {
  overflow-y: scroll;
  max-height: 70vh;
}
@media screen and (max-width: 480px) {
  .modal_area.modal_area_tag {
    padding-top: 110px;
  }
}
