@charset "UTF-8";
ul {
  list-style: none; }

html, body,
h1, h2, h3, h4, h5, h6,
a, p, span,
em, small, strong, gnav_menu
sub, sup,
mark, del, ins, strike,
abbr, dfn,
blockquote, q, cite,
code, pre,
ol, ul, li, dl, dt, dd,
div, section, article,
main, aside, nav,
header, hgroup, footer,
img, figure, figcaption,
address, time,
audio, video,
canvas, iframe,
btn_detail_modals, summary,
fieldset, form, label, legend,
table, caption,
tbody, tfoot, thead,
tr, th, td, button {
  margin: 0;
  padding: 0;
  border: 0; }

* {
  box-sizing: border-box; }

table.common_table th, table.common_table td {
  padding: 0.5em; }

th.fw_n {
  font-size: 90%; }

@media screen and (min-width: 1200px) {
  .tb:not(.pc), .sp {
    display: none !important; } }
@media screen and (min-width: 641px) and (max-width: 1199px) {
  .pc:not(.tb), .sp:not(.tb) {
    display: none !important; } }
@media screen and (max-width: 640px) {
  .tb:not(.sp), .pc {
    display: none !important; } }
@media screen and (min-width: 1200px) {
  .u-tb:not(.u-pc), .u-sp {
    display: none !important; } }
@media screen and (min-width: 641px) and (max-width: 1199px) {
  .u-pc:not(.u-tb), .u-sp:not(.u-tb) {
    display: none !important; } }
@media screen and (max-width: 640px) {
  .u-tb:not(.u-sp), .u-pc {
    display: none !important; } }
.or, .red, .u-text-vivid {
  color: #ff6900; }

.nv {
  color: #0b308f !important; }

.bg_lnv {
  background-color: #f7f9ff; }

@media screen and (max-width: 640px) {
  .bg_lyl_sp {
    background-color: #fffef3; } }

.bg_wh {
  background-color: #fff; }

.bg_lyl {
  background-color: #fffef3 !important; }

.txt_s, .u-text-s {
  font-size: 12px;
  line-height: 1.4;
  display: inline-block; }

.txt_m, .u-text-m {
  font-size: clamp(18px, 4vw, 24px); }

.txt_l, .u-text-l {
  font-size: clamp(20px, 5.5vw, 40px); }

.m0 {
  margin: 0 !important; }

.mauto {
  margin: auto; }

.mb0 {
  margin-bottom: 0px !important; }

.mb5 {
  margin-bottom: 5px !important; }

.mb10 {
  margin-bottom: 10px !important; }

.mb20 {
  margin-bottom: clamp(15px, 2vw, 20px) !important; }

.mb30 {
  margin-bottom: clamp(20px, 3vw, 30px) !important; }

.mb40 {
  margin-bottom: clamp(25px, 4vw, 40px) !important; }

.mb50 {
  margin-bottom: clamp(30px, 5vw, 50px) !important; }

.mb60 {
  margin-bottom: clamp(35px, 6vw, 60px) !important; }

.mb70 {
  margin-bottom: clamp(35px, 7vw, 70px) !important; }

.mt0 {
  margin-top: 0px !important; }

.mt10 {
  margin-top: 10px !important; }

.mt20 {
  margin-top: clamp(15px, 2vw, 20px) !important; }

.mt30 {
  margin-top: clamp(20px, 3vw, 30px) !important; }

.mt40 {
  margin-top: clamp(25px, 4vw, 40px) !important; }

.mt50 {
  margin-top: clamp(30px, 5vw, 50px) !important; }

.mt60 {
  margin-top: clamp(35px, 6vw, 60px) !important; }

.mt70 {
  margin-top: clamp(40px, 7vw, 70px) !important; }

@media screen and (max-width: 640px) {
  .sp-mt0 {
    margin-top: 0px !important; } }

.mr0 {
  margin-right: 0px !important; }

.p0 {
  padding: 0px !important; }

.pb0 {
  padding-bottom: 0px !important; }

.pb10 {
  padding-bottom: 10px !important; }

.pb20 {
  padding-bottom: clamp(15px, 2vw, 20px) !important; }

.pb30 {
  padding-bottom: clamp(20px, 3vw, 30px) !important; }

.pb40 {
  padding-bottom: clamp(25px, 4vw, 40px) !important; }

.pb50 {
  padding-bottom: clamp(30px, 5vw, 50px) !important; }

.pb70 {
  padding-bottom: clamp(35px, 7vw, 70px) !important; }

.pb100 {
  padding-bottom: clamp(50px, 10vw, 100px) !important; }

.pt0 {
  padding-top: 0px !important; }

.pt10 {
  padding-top: 10px !important; }

.p10 {
  padding: 10px !important; }
  @media screen and (max-width: 640px) {
    .p10 {
      padding: 8px !important; } }

.p1em {
  padding: 1em !important; }
  @media screen and (max-width: 640px) {
    .p1em {
      padding: 8px !important; } }

.pt20 {
  padding-top: clamp(15px, 2vw, 20px) !important; }

.pt30 {
  padding-top: clamp(20px, 3vw, 30px) !important; }

.pt40 {
  padding-top: clamp(20px, 4vw, 40px) !important; }

.pt50 {
  padding-top: clamp(30px, 5vw, 50px) !important; }

.pt70 {
  padding-top: clamp(35px, 7vw, 70px) !important; }

.pt80 {
  padding-top: clamp(70px, 8vw, 80px) !important; }

.ilb {
  display: inline-block; }

.left {
  text-align: left; }

.u-center {
  text-align: center; }

@media screen and (min-width: 1200px) {
  .pc-center {
    text-align: center !important; } }

.inline-block {
  display: inline-block; }

body {
  color: #0b308f;
  line-height: 1.8;
  font-family: noto, sans-serif;
  scroll-behavior: smooth; }

.bold, .u-text-bold {
  font-weight: 700; }

.num {
  font-family: "Helvetica Neue", "Helvetica", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Arial", "Yu Gothic", "Meiryo", sans-serif;
  font-weight: 700; }

.flex, .u-flex {
  display: flex;
  justify-content: center; }
  main .flex > *, main .u-flex > * {
    margin: 10px 10px 10px 10px; }
  @media screen and (max-width: 640px) {
    main .flex, main .u-flex {
      display: block; }
      main .flex > *, main .u-flex > * {
        margin: 10px 0px 10px 0px; } }

*:not(img).center {
  text-align: center; }

img.center {
  display: block;
  margin-left: auto;
  margin-right: auto; }

img {
  max-width: 100%;
  height: auto; }

.picture {
  line-height: 0;
  display: block; }

img.u-margintb-s, .u-margintb-s img {
  display: block;
  margin: auto; }

main a {
  color: #ff6900; }
  main a img:not(.not) {
    transition: .2s; }
    main a img:not(.not):hover {
      transform: scale(1.05); }

section:not(.link) {
  padding: 45px 10px; }
  @media screen and (max-width: 1199px) {
    section:not(.link) {
      padding: 30px 0px; } }

main p, main ul {
  padding: 20px 25px; }
  @media screen and (max-width: 1199px) {
    main p, main ul {
      padding: 20px 10px 20px 1.2em; } }
  main p + p, main ul + p {
    padding: 0px 20px 20px 20px; }
    @media screen and (max-width: 1199px) {
      main p + p, main ul + p {
        padding: 0px 0px 20px 0px; } }
  main p + table, main ul + table {
    margin-top: 0; }

@media screen and (min-width: 1200px) {
  main ul {
    padding-left: 40px; } }

@media screen and (min-width: 1200px) {
  main table ul {
    padding-left: 16px; } }

.inner, .p-inner {
  margin-left: auto;
  margin-right: auto;
  padding-left: 10px;
  padding-right: 10px;
  max-width: 1200px; }

.inner.bg_wh {
  padding: 20px;
  border-radius: 5px; }
  @media screen and (max-width: 1199px) {
    .inner.bg_wh {
      padding: 10px;
      margin: 10px !important; }
      .inner.bg_wh p {
        padding: 10px 0; } }

@media screen and (min-width: 641px) {
  .sp_center {
    text-align: left; } }
@media screen and (max-width: 640px) {
  .sp_center {
    text-align: center; } }

@media screen and (min-width: 641px) {
  .sp_left {
    text-align: center; } }
@media screen and (max-width: 640px) {
  .sp_left {
    text-align: left; } }

.max1000 .inner {
  max-width: 1000px;
  margin: 0 auto; }

li {
  margin-bottom: 0.5em;
  line-height: 1.6; }

li.no {
  list-style: none; }
  li.no::before {
    display: none !important; }
  li.no .mark {
    display: inline-block;
    margin-left: -12px; }

li[style^="list-style"]::before {
  display: none !important; }

main:not(#top) ul.c-list:not(.attention) {
  margin-left: 0; }
  main:not(#top) ul.c-list:not(.attention) li {
    list-style: none;
    position: relative; }
    main:not(#top) ul.c-list:not(.attention) li::before {
      display: inline-block;
      content: '●';
      color: #1c52a1;
      font-size: 8px;
      position: absolute;
      top: 0.8em; }

ul.dot, .c-list {
  padding-top: 0;
  margin-left: 32px; }
  ul.dot li, .c-list li {
    list-style: none; }
    ul.dot li::before, .c-list li::before {
      display: inline-block;
      content: '・';
      margin-left: -16px; }

.inner > ul.dot {
  margin-left: 0px; }

.attention, ul.c-list-notice {
  padding-top: 0;
  font-size: clamp(12px, 1.5vw, 14px); }
  .attention li:not(.no), ul.c-list-notice li:not(.no) {
    list-style: none; }
    .attention li:not(.no)::before, ul.c-list-notice li:not(.no)::before {
      display: inline-block;
      content: '※';
      margin-left: -12px; }
  .attention li.dot, ul.c-list-notice li.dot {
    list-style: none; }
    .attention li.dot::before, ul.c-list-notice li.dot::before {
      display: inline-block;
      content: '・';
      margin-left: -12px; }
  @media screen and (min-width: 1200px) {
    .attention, ul.c-list-notice {
      margin-left: 12px; } }
  @media screen and (max-width: 640px) {
    .attention, ul.c-list-notice {
      margin-left: 0; } }

.inner > ul.attention, ul.c-list-notice {
  padding-left: 24px; }

ol {
  list-style-type: decimal;
  padding: 20px 20px 5px 40px; }
  @media screen and (max-width: 1199px) {
    ol {
      padding: 20px 0px 5px 20px; } }
  ol li {
    padding-left: 0.2em; }
  ol li::marker {
    color: #ff9143;
    font-weight: bold; }

ol.c-list {
  list-style: none;
  counter-reset: number;
  margin-left: 0; }

ol.c-list li {
  position: relative;
  padding-left: 0.5em; }

ol.c-list li::before {
  display: flex;
  counter-increment: number;
  content: counter(number);
  position: absolute;
  left: 0;
  z-index: 2;
  font-size: 1em;
  top: 0.07em;
  font-weight: bold;
  color: #fff;
  justify-content: center;
  align-items: center; }

ol.c-list li::after {
  display: inline-block;
  content: "";
  width: 1.2em;
  height: 1.2em;
  padding: 0.1em;
  margin: 0.2em 0.1em;
  background: #84a1e9;
  position: absolute;
  left: -1.5em;
  top: 0;
  border-radius: 20px; }

.notice {
  border-radius: 5px;
  padding: 20px;
  background-color: #e6eaf4; }

.bg_lnv_line {
  text-align: center;
  padding: 30px 5px 5px;
  margin-bottom: -10px; }
  .bg_lnv_line span {
    padding: 5px 20px;
    border-radius: 5px;
    background-color: #f7f9ff; }

.pen {
  background: linear-gradient(transparent 65%, #ffefc4 0, #ffefc4 83%, transparent 0);
  display: inline; }

.ball_line {
  position: relative; }
  .ball_line::before {
    background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz48c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgdmlld0JveD0iMCAwIDg3IDg3Ij48Y2lyY2xlIGN4PSI0My41IiBjeT0iNDMuNSIgcj0iNDMuNSIgZmlsbD0iIzhEOUVDQiIvPjwvc3ZnPg==");
    position: absolute;
    bottom: -3px;
    right: 0;
    content: "";
    display: block;
    width: 7px;
    height: 7px; }
  .ball_line::after {
    position: absolute;
    bottom: 0;
    right: 0;
    content: "";
    display: block;
    width: 100%;
    height: 1px;
    background-color: #8d9ecb;
    background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz48c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgdmlld0JveD0iMCAwIDg3IDg3Ij48Y2lyY2xlIGN4PSI0My41IiBjeT0iNDMuNSIgcj0iNDMuNSIgZmlsbD0iI0U2RUFGNCIvPjwvc3ZnPg==");
    background-position: left 10px top 0;
    background-repeat: no-repeat;
    background-size: 2px; }

.exlink::after {
  border-bottom: 1px solid #ff6900;
  padding: 0px 0 2px 4px;
  margin-bottom: -3px;
  content: "";
  width: 1rem;
  height: 1rem;
  display: inline-block;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 16px 16px;
  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCI+PHBhdGggZD0iTTIxIDEzdjEwSDBWNGgxMnYySDJ2MTVoMTd2LThoMnptMy0xMkgxMy4wMTJsNC4wMzUgNC02Ljk3NyA3LjA3IDIuODI4IDIuODI4IDYuOTc3LTcuMDdMMjQgMTJWMXoiIGZpbGw9IiNmZjY5MDAiLz48L3N2Zz4="); }

.syoki {
  border-radius: 5px;
  font-weight: 700;
  line-height: 1.3;
  margin-top: 10px;
  margin-bottom: 10px;
  display: inline-block;
  padding: 10px;
  border: 2px solid #ff6900;
  background: #ff6900;
  color: #fff;
  text-decoration: none; }

.syoki::after {
  content: " >"; }

.syoki:hover {
  opacity: .8; }

.anime.up {
  transition: .33s;
  transform: translateY(100%); }
  .anime.up.in {
    transform: translateY(0%); }

.pref_link {
  display: flex; }
  .pref_link a {
    width: calc(20% - 10px);
    margin: 5px;
    border: 2px solid #0b308f;
    padding: 10px;
    text-align: center;
    text-decoration: none;
    color: #0b308f;
    border-radius: 5px;
    transition: .2s; }
    .pref_link a:hover {
      background-color: #e6eaf4; }
    @media screen and (max-width: 640px) {
      .pref_link a {
        font-size: 12px; } }
  @media screen and (max-width: 400px) {
    .pref_link {
      flex-wrap: wrap;
      justify-content: center; }
      .pref_link a {
        font-size: 15px;
        width: calc(33% - 10px); } }

.cp-color-box {
  background: #fff87f;
  background-image: repeating-linear-gradient(45deg, #fff87f, #fff87f 10px, #fff657 10px, #fff657 20px);
  border-radius: 10px;
  padding: clamp(10px, 2vw, 20px);
  width: 100%;
  max-width: 800px;
  margin: 0 auto clamp(10px, 2vw, 20px); }

.cp-color-box2 {
  background-color: #ffebdd;
  border-radius: 10px;
  padding: clamp(10px, 2vw, 20px);
  width: 100%;
  max-width: 800px;
  margin: 0 auto clamp(10px, 2vw, 20px); }

/*＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝*/
/*topページ*/
/*＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝*/
main#top h1 {
  line-height: 0; }
main#top h2.normal, main#top h2.panda {
  font-size: clamp(24px, 3vw, 40px);
  text-align: center;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  position: relative;
  left: 50%;
  transform: translateX(-50%); }
  @media screen and (max-width: 400px) {
    main#top h2.normal, main#top h2.panda {
      font-size: 20px; } }
  main#top h2.normal::before, main#top h2.normal span::before, main#top h2.panda::before, main#top h2.panda span::before {
    content: "";
    display: block;
    position: absolute;
    width: 7px;
    height: 7px;
    background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz48c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgdmlld0JveD0iMCAwIDg3IDg3Ij48Y2lyY2xlIGN4PSI0My41IiBjeT0iNDMuNSIgcj0iNDMuNSIgZmlsbD0iIzhEOUVDQiIvPjwvc3ZnPg==");
    position: absolute; }
  main#top h2.normal::before, main#top h2.panda::before {
    top: -3px;
    left: 0; }
  main#top h2.normal::after, main#top h2.normal span::after, main#top h2.panda::after, main#top h2.panda span::after {
    background-repeat: no-repeat;
    background-size: 3px;
    position: absolute;
    content: "";
    display: block;
    width: 100%;
    height: 1px;
    background-color: #8d9ecb;
    background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz48c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgdmlld0JveD0iMCAwIDg3IDg3Ij48Y2lyY2xlIGN4PSI0My41IiBjeT0iNDMuNSIgcj0iNDMuNSIgZmlsbD0iI0U2RUFGNCIvPjwvc3ZnPg=="); }
  main#top h2.normal::after, main#top h2.panda::after {
    top: 0;
    left: 0;
    background-position: right 10px top 0; }
  main#top h2.normal span, main#top h2.panda span {
    margin-top: 20px;
    padding-bottom: 20px;
    display: inline-block;
    position: relative; }
    @media screen and (max-width: 640px) {
      main#top h2.normal span, main#top h2.panda span {
        min-width: 180px; } }
    @media screen and (min-width: 641px) {
      main#top h2.normal span, main#top h2.panda span {
        min-width: 350px; } }
    main#top h2.normal span::before, main#top h2.panda span::before {
      bottom: -3px;
      right: 0; }
    main#top h2.normal span::after, main#top h2.panda span::after {
      bottom: 0;
      right: 0;
      background-position: left 10px top 0; }
main#top h2.normal {
  margin: 10px auto 45px auto; }
  @media screen and (max-width: 640px) {
    main#top h2.normal {
      margin: 10px auto 30px auto; } }
main#top h2.panda {
  margin: 60px; }
  @media screen and (max-width: 640px) {
    main#top h2.panda {
      margin: 25px 60px 35px; } }
  @media screen and (max-width: 400px) {
    main#top h2.panda {
      margin: 25px 50px 35px; } }
  main#top h2.panda .picture {
    transform: translateX(-20px);
    text-align: center;
    position: absolute;
    width: 125px;
    height: 145px;
    left: -120px;
    border-radius: 0 0 62.5px 62.5px;
    overflow-y: hidden;
    overflow-x: visible;
    max-width: 125px;
    min-width: unset;
    display: grid; }
    @media screen and (max-width: 400px) {
      main#top h2.panda .picture {
        transform: translateX(-10px);
        width: 100px;
        height: 114px;
        left: -100px;
        border-radius: 0 0 50px 50px; } }
    main#top h2.panda .picture img {
      object-fit: cover;
      z-index: 1;
      position: relative; }
    main#top h2.panda .picture::before {
      display: none; }
    main#top h2.panda .picture::after {
      background-color: #fff;
      content: "";
      display: block;
      width: 125px;
      height: 125px;
      position: absolute;
      bottom: 0;
      left: 0;
      border-radius: 50%; }
      @media screen and (max-width: 400px) {
        main#top h2.panda .picture::after {
          width: 100px;
          height: 100px; } }

section#top_reason, section#top_option, section#top_flow, section#top_faq, section#top_review {
  padding-bottom: 0; }
  section#top_reason::after, section#top_option::after, section#top_flow::after, section#top_faq::after, section#top_review::after {
    display: block;
    content: "";
    width: calc(100% + 20px);
    margin-left: -10px;
    background-repeat: repeat-x;
    background-position: bottom;
    background-size: 100px;
    padding-bottom: 90px; }
    @media screen and (max-width: 1199px) {
      section#top_reason::after, section#top_option::after, section#top_flow::after, section#top_faq::after, section#top_review::after {
        width: 100%;
        margin-left: 0px;
        background-size: 10%; } }

section#top_reason {
  background-color: #f7f9ff;
  background-size: contain;
  background-image: url("/commufa/common/img/top_back_b2.png"); }
  section#top_reason::after {
    background-image: url("/commufa/common/img/top_section_cloud_y.png"); }
  section#top_reason h2.panda {
    margin: clamp(30px, 6vw, 60px) auto; }

section#top_campaign {
  background-color: #fffef4;
  background-size: contain;
  background-image: url("/commufa/common/img/top_back_y2.png"); }

section#top_recommended {
  background-size: auto auto;
  background-color: white;
  background-image: repeating-linear-gradient(90deg, transparent, transparent 10px, #fcf4ee 10px, #fcf4ee 25px);
  border: solid 10px #ffeee2; }
  @media screen and (min-width: 1200px) {
    section#top_recommended {
      border: solid 15px #ffeee2; } }

section#top_option {
  background-color: #f0f9fb;
  background-size: contain;
  background-image: url("/commufa/common/img/top_back_b1.png"); }
  section#top_option::after {
    background-image: url("/commufa/common/img/top_section_cloud_y.png"); }

section#top_flow, section#top_review {
  background-color: #fffef4;
  background-size: contain;
  background-image: url("/commufa/common/img/top_back_y3.png"); }
  section#top_flow::after, section#top_review::after {
    background-image: url("/commufa/common/img/top_section_cloud_b.png"); }

section#top_faq {
  background-size: contain;
  background-image: url("/commufa/common/img/top_back_b3.png");
  background-color: #f0f9fb; }
  section#top_faq::after {
    background-image: url("/commufa/common/img/top_section_cloud_y.png"); }

section#all_option {
  background-color: #f0f9fb; }
  section#all_option .inner {
    max-width: 1200px !important; }

.cardwrap {
  padding: 10px;
  display: flex;
  z-index: 2;
  position: relative;
  justify-content: center; }
  .cardwrap > * {
    align-items: center;
    border-radius: 5px; }
  @media screen and (min-width: 1200px) {
    .cardwrap.flex2 {
      flex-wrap: wrap; }
      .cardwrap.flex2 > * {
        width: calc(50% - 20px);
        margin-left: 10px !important;
        margin-right: 10px !important;
        max-width: 500px; }
    section#top_campaign .cardwrap.flex2 {
      padding-left: 0;
      padding-right: 0;
      margin-left: auto;
      margin-right: auto; }
    .cardwrap.flex3 {
      flex-wrap: wrap;
      padding: 0;
      justify-content: flex-start;
      margin-left: auto;
      margin-right: auto; }
      .cardwrap.flex3 > * {
        width: 31%; }
    section#top_campaign .cardwrap.flex2 {
      max-width: 1060px; }
    section#top_campaign .cardwrap.flex3 {
      max-width: 1000px; }
    section#top_option .cardwrap.flex3 {
      max-width: 1160px; }
    .cardwrap.flex4 > * {
      width: 25%; }
    .cardwrap.flex_ponta {
      flex-wrap: wrap; }
      .cardwrap.flex_ponta > * {
        width: calc(50% - 45px);
        max-width: unset; } }
  @media screen and (min-width: 641px) and (max-width: 1199px) {
    .cardwrap.flex2 > * {
      width: 50%; }
    .cardwrap.flex2 > * {
      width: calc( 50% - 5px);
      margin-top: 10px; }
      .cardwrap.flex2 > *:not(:nth-child(2n)) {
        margin-right: 10px; }
    section#top_campaign .cardwrap.flex2.flex2 {
      flex-wrap: wrap; }
    .cardwrap.flex2.alone > * {
      width: 100%; }
    .cardwrap.flex3 {
      max-width: 1000px;
      margin: 0 auto;
      flex-wrap: wrap;
      justify-content: flex-start; }
      .cardwrap.flex3 > * {
        width: calc( 50% - 5px);
        margin-top: 10px; }
        .cardwrap.flex3 > *:not(:nth-child(2n)) {
          margin-right: 10px; }
    .cardwrap.flex4 {
      max-width: 1000px;
      margin: 0 auto;
      flex-wrap: wrap;
      justify-content: flex-start; }
      .cardwrap.flex4 > * {
        width: calc(50% - 50px);
        margin-top: 10px; }
        .cardwrap.flex4 > *:not(:nth-child(2n)) {
          margin-right: 10px; }
    .cardwrap.flex_ponta {
      flex-wrap: wrap; }
      .cardwrap.flex_ponta > * {
        width: 100%; } }
  @media screen and (max-width: 640px) {
    .cardwrap.flex2, .cardwrap.flex3, .cardwrap.flex4 {
      flex-direction: column; }
      .cardwrap.flex2 > *, .cardwrap.flex3 > *, .cardwrap.flex4 > * {
        width: 100%;
        max-width: unset;
        margin-left: auto;
        margin-right: auto;
        margin-bottom: 20px; }
    section#top_campaign .cardwrap {
      margin-top: -24px;
      margin-bottom: -20px; }
    .cardwrap.flex4
    > * {
      margin-bottom: 40px !important; }
    .cardwrap.flex_ponta {
      padding: 0 0 10px 0;
      flex-wrap: wrap; }
      .cardwrap.flex_ponta > * {
        width: 100%; } }

div[class^='card_'] {
  border-radius: 5px;
  background-color: white;
  border: 2px solid #0b308f; }
  div[class^='card_'] .img {
    overflow: hidden; }

.card_1 {
  max-width: 475px; }
  @media screen and (min-width: 641px) {
    .card_1 {
      margin: 10px; } }
  .card_1 .above {
    display: flex;
    text-align: center;
    justify-content: center;
    align-items: center;
    height: 210px;
    padding: 10px; }
    @media screen and (min-width: 641px) and (max-width: 1199px) {
      .card_1 .above {
        flex-direction: column; }
        .card_1 .above br {
          display: none; } }
  .card_1 .title {
    display: inline;
    font-size: clamp(20px, 2vw, 24px);
    margin-left: 10px; }
    @media screen and (min-width: 641px) and (max-width: 1199px) {
      .card_1 .title {
        margin: 10px 0 0 0; } }
  .card_1 img {
    max-height: 167px;
    max-width: 167px;
    margin-right: 10px;
    width: auto; }
    @media screen and (max-width: 400px) {
      .card_1 img {
        width: 40%; } }
    @media screen and (min-width: 641px) and (max-width: 1199px) {
      .card_1 img {
        max-height: 124px;
        object-fit: fill; } }
  .card_1 .exp {
    background-color: #ecf1ff;
    margin: 5px;
    border-radius: 0 0 5px 5px;
    padding: 10px;
    height: calc(100% - 220px); }
    @media screen and (min-width: 641px) {
      .card_1 .exp {
        padding: 20px; } }

@media screen and (min-width: 1200px) {
  .card_2 {
    margin-top: 20px; }
    .card_2:not(:nth-child(3n)) {
      margin-right: 35px; } }
.card_2 .img {
  line-height: 0;
  padding: 0;
  text-align: center; }
  .card_2 .img img {
    width: 100%; }
.card_2 .title {
  display: block;
  width: calc(100% - 20px);
  text-align: center;
  padding: 10px 0 !important;
  margin: 10px 10px 0 10px !important;
  border: none !important; }
  .card_2 .title + * {
    padding-top: 20px !important; }
.card_2 .exp {
  padding: 20px; }
.card_2:not(.alone) {
  display: flex;
  flex-direction: column; }
  .card_2:not(.alone) .btn {
    margin-top: auto; }
.card_2 .btn.normal {
  padding: 6px 10px;
  width: calc(100% - 20px); }
.card_2.alone {
  margin-top: -13px !important;
  z-index: 5;
  position: relative; }
  @media screen and (max-width: 640px) {
    .card_2.alone {
      margin: 0 10px 35px; } }
  @media screen and (min-width: 641px) {
    .card_2.alone {
      margin: 0 auto;
      display: flex;
      justify-content: center;
      align-items: center; } }
  @media screen and (min-width: 641px) and (min-width: 1200px) {
    .card_2.alone {
      max-width: 1020px;
      padding: 20px; }
      .card_2.alone .ball_line {
        padding: 15px; } }
  @media screen and (min-width: 641px) and (min-width: 641px) and (max-width: 1199px) {
    .card_2.alone {
      padding: 20px 10px 20px 10px;
      position: relative;
      left: 50%;
      transform: translateX(calc(-50% - 10px));
      margin: 0 10px;
      max-width: 980px; }
      .card_2.alone .ball_line {
        padding: 0 0 10px 0; } }
  @media screen and (min-width: 641px) {
      .card_2.alone .img {
        width: 50%; }
      .card_2.alone .below {
        width: 50%; }
      .card_2.alone .ball_line {
        margin-left: 20px;
        font-size: clamp(20px, 2.5vw, 28px); }
      .card_2.alone .btn {
        max-width: 400px; }
      .card_2.alone .exp {
        padding-bottom: 0; } }

.card_3 {
  padding: 10px;
  display: flex;
  flex-direction: column; }
  @media screen and (min-width: 1200px) {
    .card_3 {
      max-width: 356px; }
      .card_3:nth-child(n + 4) {
        margin-top: 30px; }
      .card_3:not(:nth-child(3n)) {
        margin-right: 40px; } }
  .card_3 .title {
    margin: -10px 0px 0px 0px !important;
    background: #0b308f;
    color: #fff;
    text-align: center;
    padding: 5px !important;
    width: calc(100% + 20px); }
  .card_3 .attention {
    margin-left: 0;
    margin-bottom: 10px;
    padding: 0 5px 0 16px; }
  .card_3 .exp {
    padding: 5px; }
  .card_3 img {
    display: block;
    margin: 20px auto 10px; }
  .card_3 .btn.normal {
    margin: auto auto 15px;
    min-width: 250px; }
    @media screen and (min-width: 1200px) {
      .card_3 .btn.normal {
        min-width: 300px; } }

.card_4 {
  font-weight: 700;
  position: relative;
  overflow: visible !important; }
  @media screen and (min-width: 1200px) {
    .card_4 {
      margin-right: 35px;
      max-width: 265px; } }
  @media screen and (min-width: 641px) and (max-width: 1199px) {
    .card_4 {
      margin: 30px; } }
  @media screen and (max-width: 640px) {
    .card_4 {
      transform: translateX(5px);
      width: calc(100% - 15px) !important; } }
  .card_4::before {
    content: "";
    display: block;
    width: 65px;
    height: 64px;
    position: absolute;
    left: -22px;
    top: -18px;
    background-image: url("/commufa/common/img/flow_num.png");
    background-size: 576px 128px;
    background-repeat: no-repeat; }
  .card_4:nth-child(1)::before {
    background-position: 0px 0; }
  .card_4.last:nth-child(1)::before {
    background-position: 0px -64px; }
  .card_4:nth-child(2)::before {
    background-position: -64px 0; }
  .card_4.last:nth-child(2)::before {
    background-position: -64px -64px; }
  .card_4:nth-child(3)::before {
    background-position: -128px 0; }
  .card_4.last:nth-child(3)::before {
    background-position: -128px -64px; }
  .card_4:nth-child(4)::before {
    background-position: -192px 0; }
  .card_4.last:nth-child(4)::before {
    background-position: -192px -64px; }
  .card_4:nth-child(5)::before {
    background-position: -256px 0; }
  .card_4.last:nth-child(5)::before {
    background-position: -256px -64px; }
  .card_4:nth-child(6)::before {
    background-position: -320px 0; }
  .card_4.last:nth-child(6)::before {
    background-position: -320px -64px; }
  .card_4:nth-child(7)::before {
    background-position: -384px 0; }
  .card_4.last:nth-child(7)::before {
    background-position: -384px -64px; }
  .card_4:nth-child(8)::before {
    background-position: -448px 0; }
  .card_4.last:nth-child(8)::before {
    background-position: -448px -64px; }
  .card_4:nth-child(9)::before {
    background-position: -512px 0; }
  .card_4.last:nth-child(9)::before {
    background-position: -512px -64px; }
  .card_4 .title {
    width: 100%;
    padding: 0 0 0 45px !important;
    height: 35px;
    margin: 0 !important;
    border: none !important; }
  .card_4:not(.last) {
    border: 7px solid #ecf1ff !important; }
    .card_4:not(.last) .title {
      background-color: #ecf1ff; }
    .card_4:not(.last)::after {
      content: "";
      display: block;
      position: absolute;
      width: 49px;
      height: 17px;
      background-image: url("/commufa/common/img/arrow.png");
      top: 50%;
      right: -36px;
      z-index: 5; }
      @media screen and (max-width: 640px) {
        .card_4:not(.last)::after {
          top: 107%;
          right: calc(50% - 25px);
          transform: rotate(90deg); } }
  @media screen and (min-width: 641px) and (max-width: 1199px) {
    .card_4:nth-child(2n)::after {
      left: 0;
      top: 100%;
      transform: rotate(135deg) translate(100%, 135%); } }
  .card_4.last {
    color: #ff6900;
    border: 7px solid #ffeee2; }
    .card_4.last .title {
      background-color: #ffeee2; }
  .card_4 .exp {
    padding: 20px !important; }
    @media screen and (min-width: 641px) {
      .card_4 .exp {
        text-align: center; } }
    @media screen and (max-width: 640px) {
      .card_4 .exp img {
        width: auto;
        height: 115px;
        position: absolute;
        top: -5px;
        right: 10px; } }
    @media screen and (max-width: 500px) {
      .card_4 .exp img {
        top: unset;
        bottom: 0;
        right: 0;
        height: auto; } }
    @media screen and (max-width: 400px) {
      .card_4 .exp img {
        max-width: 20vw; } }
    @media screen and (min-width: 500px) and (max-width: 640px) {
      .card_4 .exp br {
        display: none; } }
  @media screen and (min-width: 1200px) {
    .flex_ponta .card_4 {
      margin-bottom: 50px; } }
  @media screen and (min-width: 641px) and (max-width: 1199px) {
    .flex_ponta .card_4.last {
      margin-bottom: 0px; }
    .flex_ponta .card_4:not(.last) {
      margin-bottom: 30px; } }
  @media screen and (max-width: 640px) {
    .flex_ponta .card_4.last {
      margin-bottom: 0px; }
    .flex_ponta .card_4:not(.last) {
      margin-bottom: 50px; } }
  .flex_ponta .card_4 .exp {
    text-align: left;
    font-weight: 400; }
    .flex_ponta .card_4 .exp img {
      height: auto;
      position: relative;
      bottom: 0px;
      right: 0px;
      max-height: unset;
      display: block;
      margin: 10px auto 20px; }
  @media screen and (min-width: 1200px) {
    .flex_ponta .card_4:nth-child(2n) {
      margin-right: -5px !important; }
      .flex_ponta .card_4:nth-child(2n)::after {
        left: 0;
        top: 100%;
        transform: rotate(135deg) translate(100%, 135%); } }
  @media screen and (max-width: 1199px) {
    .flex_ponta .card_4::after {
      left: unset;
      right: calc(50% - 25px);
      top: calc(100% + 18px);
      transform: rotate(90deg) !important; } }

.card_big {
  overflow: visible !important;
  padding: 10px;
  max-width: 1000px;
  text-align: center;
  position: relative; }
  @media screen and (min-width: 1200px) {
    .card_big {
      margin: 50px auto; } }
  @media screen and (max-width: 1199px) {
    .card_big {
      margin: 25px auto; } }
  .card_big .cardinner_big {
    display: inline; }
    .card_big .cardinner_big .exp {
      display: inline-block;
      text-align: left; }
      @media screen and (max-width: 1199px) {
        .card_big .cardinner_big .exp {
          padding: 10px; } }
  .card_big .title {
    color: #ff6900;
    margin: 30px;
    display: inline-block;
    font-size: clamp(18px, 5vw, 40px); }
    @media screen and (max-width: 1199px) {
      .card_big .title {
        margin: 20px; } }
  .card_big .corner_ribbon {
    position: absolute;
    left: -16px;
    top: -15px; }
    @media screen and (min-width: 641px) and (max-width: 1199px) {
      .card_big .corner_ribbon {
        width: 130px;
        left: -11px;
        top: -10px; } }
    @media screen and (max-width: 640px) {
      .card_big .corner_ribbon {
        width: 100px;
        left: -9px;
        top: -8px; } }
  @media screen and (max-width: 1199px) {
    .card_big .above {
      display: flex;
      flex-direction: column-reverse; } }
  .card_big .btn.big {
    margin: 0 auto 30px; }
    @media screen and (max-width: 1199px) {
      .card_big .btn.big {
        margin: 10px auto 20px; } }

/*＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝*/
/*Hタグ*/
/*＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝*/
h2.ribbon {
  text-align: center;
  background: linear-gradient(to right, #0b308e, #205baa);
  color: #fff;
  position: relative;
  padding: clamp(5px, 1vw, 10px) clamp(30px, 3vw, 37px) !important;
  margin-bottom: 20px; }
  h2.ribbon::before, h2.ribbon::after {
    position: absolute;
    top: 0;
    content: "";
    display: block;
    width: 45px;
    height: 100%;
    transform: scaleX(0.5);
    background-repeat: no-repeat;
    background-size: 100% 100%; }
  h2.ribbon::before {
    left: -12px;
    background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz48c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgdmlld0JveD0iMCAwIDg3IDg3IiBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJub25lIj48cGF0aCBmaWxsPSIjRkZGIiBkPSJNLS4yLjNsODcuMSA0My4yTC0uMiA4Ny4zIi8+PC9zdmc+"); }
  h2.ribbon::after {
    right: -12px;
    background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz48c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSIgdmlld0JveD0iMCAwIDg3IDg3Ij48cGF0aCBmaWxsPSIjRkZGIiBkPSJNODYuOSA4Ny4zTC0uMiA0My41IDg2LjkuMyIvPjwvc3ZnPg=="); }

.bg_lnv h2.ribbon::before {
  left: -12px;
  background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz48c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgdmlld0JveD0iMCAwIDg3IDg3IiBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJub25lIj48cGF0aCBmaWxsPSIjZjdmOWZmIiBkPSJNLS4yLjNsODcuMSA0My4yTC0uMiA4Ny4zIi8+PC9zdmc+"); }
.bg_lnv h2.ribbon::after {
  right: -12px;
  background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz48c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSIgdmlld0JveD0iMCAwIDg3IDg3Ij48cGF0aCBmaWxsPSIjZjdmOWZmIiBkPSJNODYuOSA4Ny4zTC0uMiA0My41IDg2LjkuMyIvPjwvc3ZnPg=="); }

main:not(#top) h1 {
  text-align: center;
  display: inline-flex;
  margin: 0 auto 0px auto;
  padding: 0 30px;
  justify-content: center;
  align-items: center;
  font-size: clamp(22px, 3vw, 40px);
  position: relative;
  left: 50%;
  transform: translateX(-50%);
  width: 100%; }
  @media screen and (max-width: 1199px) {
    main:not(#top) h1 {
      padding: 0 5px;
      margin: 0 auto 0px auto;
      line-height: 1.3; } }
  main:not(#top) h1::before {
    display: inline-block;
    content: "";
    width: 120px;
    height: 120px;
    background-image: url("/commufa/common/img/panda2.png");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: bottom;
    z-index: 1;
    margin-right: 15px;
    position: relative; }
    @media screen and (max-width: 1199px) {
      main:not(#top) h1::before {
        height: auto;
        min-width: 75px;
        min-height: 105px; } }
  main:not(#top) h1::after {
    position: absolute;
    display: inline-block;
    content: "";
    width: 100%;
    height: 5px;
    bottom: 10px;
    background: linear-gradient(#0b308f 50%, #fff 0, #fff 80%, #8597c6 0); }
  main:not(#top) h1 + * {
    margin-top: 30px;
    padding-top: 0; }
  main:not(#top) h1.double {
    line-height: 1.3; }
    main:not(#top) h1.double::after {
      bottom: -10px; }
    main:not(#top) h1.double::before {
      bottom: -20px; }
  main:not(#top) h1#dazn::before {
    background-image: url("/commufa/common/img/dazn_logo.png");
    margin-right: 15px; }
main:not(#top) h2:not(.center):not(.flag1):not(.flag2):not(.flag3):not(.flag4):not(.ribbon) {
  background: linear-gradient(to right, #0b308e, #205baa);
  position: relative;
  color: white;
  padding: 15px 10px 15px 24px; }
  @media screen and (max-width: 1199px) {
    main:not(#top) h2:not(.center):not(.flag1):not(.flag2):not(.flag3):not(.flag4):not(.ribbon) {
      width: calc(100% + 20px);
      margin-left: -10px; } }
  main:not(#top) h2:not(.center):not(.flag1):not(.flag2):not(.flag3):not(.flag4):not(.ribbon)::after, main:not(#top) h2:not(.center):not(.flag1):not(.flag2):not(.flag3):not(.flag4):not(.ribbon)::before {
    position: absolute;
    display: block;
    content: ""; }
  main:not(#top) h2:not(.center):not(.flag1):not(.flag2):not(.flag3):not(.flag4):not(.ribbon)::after {
    height: 100%;
    width: 2px;
    top: 0;
    left: 5px;
    background-color: #fff; }
  main:not(#top) h2:not(.center):not(.flag1):not(.flag2):not(.flag3):not(.flag4):not(.ribbon)::before {
    width: 100%;
    height: 2px;
    left: 0;
    bottom: 5px;
    background-color: #fff100; }
  main:not(#top) h2:not(.center):not(.flag1):not(.flag2):not(.flag3):not(.flag4):not(.ribbon):not(:nth-child(1)) {
    margin-top: 40px; }
main:not(#top) h2[class^="flag"] {
  font-size: 40px;
  position: relative;
  border-top: 5px double #0b308f;
  height: 85px;
  margin: 90px 10px 20px 10px;
  text-align: center;
  padding: 12px 10px 0 100px;
  line-height: 1.4; }
  main:not(#top) h2[class^="flag"]::before {
    content: "";
    width: 67px;
    height: 85px;
    position: absolute;
    left: 20px;
    top: 0px; }
  @media screen and (max-width: 1199px) {
    main:not(#top) h2[class^="flag"] {
      margin: 60px 0 20px 0; } }
  @media screen and (min-width: 641px) and (max-width: 1199px) {
    main:not(#top) h2[class^="flag"] {
      font-size: 24px; } }
  @media screen and (max-width: 640px) {
    main:not(#top) h2[class^="flag"] {
      font-size: 24px; } }
  @media screen and (max-width: 400px) {
    main:not(#top) h2[class^="flag"] {
      font-size: 18px;
      height: 85px;
      padding: 12px 10px 0 65px; }
      main:not(#top) h2[class^="flag"]::before {
        left: 10px;
        width: 48px;
        height: 61px;
        background-size: contain; } }
main:not(#top) h2.flag1::before {
  background-image: url("/commufa/common/img/flag_point1.png"); }
main:not(#top) h2.flag2::before {
  background-image: url("/commufa/common/img/flag_point2.png"); }
main:not(#top) h2.flag3::before {
  background-image: url("/commufa/common/img/flag_point3.png"); }
main:not(#top) h2.flag4::before {
  background-image: url("/commufa/common/img/flag_point4.png"); }
main:not(#top) h3:not(.bg_lnv):not(.center) {
  border: solid #0b308f;
  border-width: 1px 1px 1px 5px;
  padding: 5px 5px 5px 15px;
  margin: 20px 20px 20px 20px; }
  @media screen and (max-width: 1199px) {
    main:not(#top) h3:not(.bg_lnv):not(.center) {
      margin: 20px 0px; } }
main:not(#top) h2 + h3:not(.bg_lnv):not(.center), main:not(#top) table + h3:not(.bg_lnv):not(.center) {
  margin-top: 40px; }
main:not(#top) h2 + * {
  padding-top: 30px;
  margin-top: 0px; }
main:not(#top) h3 + * {
  padding-top: 0; }
main:not(#top) h4 + *, main:not(#top) .c-h4 + * {
  padding-top: 0; }
main:not(#top) h3.bg_lnv {
  background-color: #f7f9ff;
  text-align: center;
  margin: 20px;
  padding: 10px;
  max-width: 100%;
  display: block;
  border-radius: 5px; }
main:not(#top) h4, main:not(#top) .c-h4 {
  display: inline-block;
  padding: 5px 10px !important;
  margin: 10px 0px 10px 20px;
  background-color: #e6eaf4;
  border: none !important; }
  @media screen and (max-width: 1199px) {
    main:not(#top) h4, main:not(#top) .c-h4 {
      margin: 10px 0px 10px 0px; } }
main:not(#top) h5 {
  padding: 15px 10px 0px 10px;
  margin-left: 10px;
  margin-bottom: -10px; }
  @media screen and (max-width: 1199px) {
    main:not(#top) h5 {
      margin: 0px 0px -10px 0px;
      padding: 0px; } }

.dashed {
  width: 100%;
  overflow: hidden; }
  .dashed span {
    position: relative;
    display: inline-block;
    padding: 0.2em 1em; }
  .dashed span:before, .dashed span:after {
    position: absolute;
    width: 10%;
    border-top: none;
    content: '';
    height: 100%;
    bottom: 0; }
  .dashed span:before {
    left: calc(0px - clamp(10px,10vw,90px));
    transform: translateY(35%) rotate(145deg);
    border-left: #0b308f 2px dashed; }
    @media screen and (max-width: 640px) {
      .dashed span:before {
        transform: translateY(20%) rotate(145deg); } }
  .dashed span:after {
    right: calc(0px - clamp(10px,10vw,90px));
    transform: translateY(35%) rotate(-145deg);
    border-right: #0b308f 2px dashed; }
    @media screen and (max-width: 640px) {
      .dashed span:after {
        transform: translateY(20%) rotate(-145deg); } }
  .dashed.yellow span:after {
    border-right: #ffe822 2px dashed; }
  .dashed.yellow span:before {
    border-left: #ffe822 2px dashed; }

.ribbon {
  --r: .8em;
  padding-inline: calc(var(--r) + .3em);
  clip-path: polygon(0 0, 100% 0, calc(100% - var(--r)) 50%, 100% 100%, 0 100%, var(--r) 50%);
  width: 100%;
  padding: 0.3em clamp(20px, 4vw, 40px) !important;
  background: #ffe947;
  font-size: clamp(18px, 3vw, 28px);
  line-height: 1.4;
  color: #0b308f;
  font-weight: bold;
  position: relative;
  overflow: hidden;
  text-align: center;
  margin: clamp(20px, 3vw, 40px) auto clamp(1em, 3vw, 20px) !important;
  display: flex;
  justify-content: center;
  align-items: center; }

.tag {
  display: inline-block;
  background: #ffcaa4;
  padding: 5px 0.5em;
  border-radius: 5px;
  line-height: 1;
  margin: 0 0.5em; }

.feetbl .tag {
  font-size: clamp(11px, 1vw, 13px);
  margin: 0.2em;
  background: #fb832f;
  color: #fff; }

/*＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝*/
/*FAQ*/
/*＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝*/
.faq {
  max-width: 900px;
  margin: 0px auto; }
  .faq .faq_q, .faq .faq_a {
    margin-left: 10px;
    margin-right: 10px;
    position: relative;
    padding: 0px 20px 10px 40px;
    background-color: #fff; }
    .faq .faq_q::before, .faq .faq_a::before {
      top: 16px;
      position: absolute;
      margin-left: -30px;
      display: inline-flex;
      justify-content: center;
      align-items: center;
      color: #fff;
      width: 36px;
      height: 36px;
      font-size: 25px;
      font-family: "Helvetica Neue", "Helvetica", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Arial", "Yu Gothic", "Meiryo", sans-serif;
      font-weight: 700;
      border-radius: 50%; }
  .faq .faq_q {
    cursor: pointer;
    margin-top: 20px;
    border-radius: 5px 5px 0 0;
    position: relative;
    display: flex;
    align-items: center; }
    .faq .faq_q::before {
      content: "Q";
      background: linear-gradient(to right, #0b308e, #205baa); }
    .faq .faq_q::after {
      position: absolute;
      font-weight: 700;
      padding-top: 5px; }
    .faq .faq_q:not(.open)::after {
      content: "+";
      right: 18px; }
    .faq .faq_q.open::after {
      content: "-";
      right: 20px; }
    .faq .faq_q .txt {
      padding: 10px 20px 10px 15px; }
  .faq .faq_a::after {
    content: "";
    display: block;
    width: 90%;
    margin-left: 5%;
    background-color: #fafafa;
    height: 2px;
    position: absolute;
    top: -5px;
    left: 0; }
  .faq .faq_a::before {
    content: "A";
    background-color: #ff6900; }
  .faq .faq_a .txt {
    padding: 10px 10px 10px 15px; }
  .faq .txt {
    margin-top: 10px;
    display: inline-block; }

@media screen and (min-width: 641px) {
  #main_visual {
    background-image: url("/commufa/common/img/top_bg_l.png"), url("/commufa/common/img/top_bg_r.png"), url("/commufa/common/img/top_bg_c.png");
    background-repeat: no-repeat, no-repeat, repeat-y;
    background-position: left top, right bottom, 0 0;
    background-size: 50vw, 50vw, 100%;
    padding: 0 15px;
    /*	animation: bgscroll 10s linear infinite;
    	@-webkit-keyframes bgscroll {
    	0% {background-position:left top,right bottom,0 0;}
    	100% { background-position:left top,right bottom,0 630px;}
    	}*/ } }
@media screen and (max-width: 1199px) {
  #main_visual {
    border-top: 2px solid #0b308f; } }
@media screen and (max-width: 640px) {
  #main_visual {
    padding: 0; }
    #main_visual .inner {
      padding: 0; }
    #main_visual .btn_area {
      padding: 20px; } }

.tab_contents {
  padding-top: 0 !important;
  display: none; }
  .tab_contents.selected {
    display: block; }
  .tab_contents.dazn_tab_contents {
    padding-top: 30px !important; }
    .tab_contents.dazn_tab_contents img {
      display: block;
      margin: 10px auto; }

.tab {
  width: calc(100% + 20px);
  margin-left: -10px;
  border-bottom: 1px solid #0b308f;
  display: flex;
  justify-content: center; }
  .tab.noborder {
    border-bottom: none !important; }
  .tab.center {
    text-align: center; }
  @media screen and (max-width: 1199px) {
    .tab {
      width: 100%;
      margin-left: 0; } }
  .tab > button {
    max-width: 320px;
    width: 100%;
    line-height: 1.2;
    font-size: clamp(16px, 2.75vw, 22px);
    cursor: pointer;
    transition: .3s;
    height: 85px;
    background-color: #f7f9ff;
    color: #9fa8cc;
    font-weight: 700;
    border-radius: 10px 10px 0 0;
    border: solid #0b308f;
    border-width: 1px 1px 0 1px;
    padding: 0 25px; }
    .tab > button.selected {
      background: linear-gradient(to right, #0b308e, #205baa);
      color: #fff; }
    @media screen and (min-width: 1200px) {
      .tab > button {
        margin: 0 5px;
        padding: 0 30px; } }
    @media screen and (min-width: 641px) {
      .tab > button:nth-child(1) {
        margin-right: 5px; }
      .tab > button:nth-child(2) {
        margin-left: 5px; } }
    @media screen and (min-width: 641px) and (max-width: 1199px) {
      .tab > button {
        height: 80px;
        line-height: 75px;
        margin: 0 5px;
        padding: 0 15px; } }
    @media screen and (max-width: 640px) {
      .tab > button {
        height: 65px;
        line-height: 55px;
        margin: 0 2px;
        padding: 0 5px; } }

.minimenu {
  width: calc(100% + 20px);
  margin-left: -10px;
  margin-bottom: 40px;
  border-top: 2px solid #0b308f;
  border-bottom: 2px solid #0b308f;
  background-color: #f7f9ff;
  overflow: hidden; }
  @media screen and (max-width: 640px) {
    .minimenu {
      width: 100%;
      margin-left: 0;
      text-align: center; } }
  .minimenu ul {
    width: calc(100% + 20px);
    margin-left: -10px;
    padding: 10px;
    display: inline-flex;
    justify-content: center;
    /*@include mq(sp){
    	flex-direction: column;
    	text-align: left;
    	width: auto;
    }*/ }
    @media screen and (max-width: 1199px) {
      .minimenu ul {
        padding: 10px;
        flex-wrap: wrap; } }
  .minimenu li {
    list-style: none;
    padding: 0 10px;
    /*@include mq(sp){
    	&::before{
    		content: "▶";
    		padding: 5px;
    		display: inline-block;
    	}
    }*/ }
    .minimenu li a {
      color: #0b308f; }
    @media screen and (min-width: 641px) and (max-width: 1199px) {
      .minimenu li {
        padding: 5px; } }

/*＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝*/
/*テーブル*/
/*＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝*/
table {
  margin: 20px;
  width: calc(100% - 40px);
  border-spacing: 0; }
  @media screen and (max-width: 1199px) {
    table {
      margin: 20px 0;
      width: 100%; } }
  table.center th {
    text-align: center; }
  table.center td {
    text-align: center; }
  table th, table td {
    border: 2px solid #475C8E; }
  table th {
    background-color: #f3fafd;
    padding: 15px;
    min-width: 100px; }
  table td {
    padding: 15px; }
    @media screen and (max-width: 1199px) {
      table td {
        padding: 10px; } }
  table .bln {
    border-left: none; }
  table .brn {
    border-radius: 0 !important; }
  table.nobr th {
    white-space: nowrap; }
  table tr:first-child > *:first-child {
    border-radius: 5px 0 0 0; }
  table tr:first-child > *:last-child {
    border-radius: 0 5px 0 0; }
  table tr:last-child > *:first-child {
    border-radius: 5px 0 0 5px; }
  table tr:last-child > *:last-child {
    border-radius: 0 5px 5px 0; }
  table tr + tr:last-child > *:last-child {
    border-radius: 0 0 5px 0; }
  table tr + tr:last-child > *:first-child {
    border-radius: 0 0 0 5px; }
  table tr td + td, table tr td + th, table tr th + th, table tr th + td {
    border-left: none; }
  table tr + tr th, table tr + tr td {
    border-top: none; }
  table th.first_one, table td.first_one {
    border-radius: 5px 5px 0 0; }
  table th.last_one, table td.last_one {
    border-radius: 0 0 5px 5px; }
  @media screen and (max-width: 640px) {
    table.res .bln, table.res tr td + td, table.res tr td + th, table.res tr th + th, table.res tr th + td {
      border-left: 2px solid #0b308f; }
    table.res th, table.res td {
      display: block;
      border-top: none; }
    table.res tr:first-child > *:first-child {
      border-radius: 5px 5px 0 0;
      border-top: 2px solid #0b308f; }
    table.res tr:last-child > *:last-child {
      border-radius: 0 0 5px 5px; }
    table.res tr:first-child > *:last-child,
    table.res tr:last-child > *:first-child {
      border-radius: 0; }
    table.res th.first_one, table.res td.first_one {
      border-radius: 5px 5px 0 0 !important; }
    table.res th.last_one, table.res td.last_one {
      border-radius: 0 0 5px 5px !important; }
    table.res tr.sp_reverse {
      display: flex;
      flex-direction: column-reverse; }
      table.res tr.sp_reverse:last-child > *:first-child {
        border-radius: 0 0 5px 5px; }
      table.res tr.sp_reverse:last-child > *:last-child {
        border-radius: 0; } }
  @media screen and (max-width: 640px) {
    table.pref th {
      display: flex;
      flex-direction: row-reverse;
      align-items: center;
      justify-content: center; }
      table.pref th img {
        margin-left: 10px; } }
  table.fee_menu {
    text-align: center; }
    @media screen and (min-width: 641px) {
      table.fee_menu td {
        width: 33.333%; } }
    table.fee_menu img {
      margin: 10px auto -10px;
      width: auto; }
      @media screen and (min-width: 1200px) {
        table.fee_menu img {
          max-height: 120px; } }
      @media screen and (min-width: 641px) and (max-width: 1199px) {
        table.fee_menu img {
          max-height: 11vw; } }
      @media screen and (max-width: 640px) {
        table.fee_menu img {
          height: 25vw; } }
  @media screen and (max-width: 1199px) {
    table.w1000 {
      width: 1000px !important;
      font-size: 12px; }
      table.w1000 th, table.w1000 td {
        padding: 5px; } }
  table th > *:not(.btn), table td > *:not(.btn) {
    margin-left: 0 !important; }

.scroll_notice {
  margin-bottom: -10px;
  font-size: 14px;
  display: block;
  margin-top: 10px; }

.scroll_on {
  overflow-x: scroll;
  margin-bottom: 20px;
  position: relative; }

@media screen and (max-width: 1099px) {
  *[class*=u-scrollTable] {
    padding-top: 1rem;
    display: block;
    overflow-x: scroll;
    white-space: nowrap;
    -webkit-overflow-scrolling: touch;
    margin-bottom: 30px; }
    *[class*=u-scrollTable]::before {
      max-width: 100vw;
      position: absolute;
      font-size: 12px;
      transform: translateY(-100%);
      background: #e6eaf4;
      border-radius: 3px;
      padding: 2px 5px; } }
@media screen and (max-width: 640px) {
  table.p-table-responsive th, table.p-table-responsive td {
    display: block;
    width: 100%;
    margin-bottom: -2px;
    border-right: solid 2px;
    border-left: solid 2px;
    border-radius: 0 !important; }
  table.p-table-responsive .u-border-right-dotted, table.p-table-responsive .u-border-left-dotted {
    border-right-style: solid !important;
    border-left-style: solid !important; }
  table.p-table-responsive tr + tr th, table.p-table-responsive tr + tr td {
    border-top: 2px solid #475C8E; } }

th:has(.ab-fuki) {
  position: relative;
  padding-top: 2em; }
  th:has(.ab-fuki) .ab-fuki {
    position: absolute;
    display: inline-block;
    margin-bottom: 7px;
    padding: 16px;
    border-radius: 8px;
    background-color: #0b308f;
    text-align: center;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.5;
    color: #fff;
    top: 0;
    left: 50%;
    transform: translate(-50%, calc(-100% + 1em));
    width: clamp(160px, 80%, 260px); }
    th:has(.ab-fuki) .ab-fuki::after {
      content: "";
      position: absolute;
      bottom: 0;
      left: 50%;
      border-style: solid;
      border-width: 7px 7px 0 7px;
      border-color: #0b308f transparent transparent;
      translate: -50% 100%; }

.feetbl {
  text-align: center;
  border: 2px solid #0b308f;
  max-width: 900px;
  margin: 20px auto;
  border-radius: 5px;
  overflow: hidden; }
  @media screen and (min-width: 1200px) {
    .feetbl.mansion .feetbl_l {
      width: 66% !important; }
    .feetbl.mansion .feetbl_r {
      width: 34% !important; }
    .feetbl.mansion .feetbl_r_fee::after {
      width: 70px !important;
      height: 70px !important;
      right: -67px !important;
      top: -30px !important; } }
  .feetbl .feetbl_line {
    display: flex;
    padding: 20px;
    border-bottom: 2px solid #0b308f;
    position: relative;
    overflow: hidden; }
    @media screen and (max-width: 1199px) {
      .feetbl .feetbl_line {
        flex-direction: column; } }
    .feetbl .feetbl_line:last-child {
      border-bottom: none; }
    .feetbl .feetbl_line.bg_lyl::before {
      font-size: 18px;
      display: block;
      position: absolute;
      top: 11px;
      font-weight: 700;
      left: -44px;
      content: "おすすめ";
      display: block;
      width: 150px;
      height: 40px;
      line-height: 44px;
      color: #fff;
      background: linear-gradient(to right, #0b308e, #205baa);
      transform: rotate(-45deg); }
      @media screen and (max-width: 640px) {
        .feetbl .feetbl_line.bg_lyl::before {
          /*				top: 4px;
          				font-size: 10px;
          				width: 156px;
          				height: 23px;
          				line-height: 24px;
          				left: -63px;*/ } }
    .feetbl .feetbl_line .feetbl_l, .feetbl .feetbl_line .feetbl_r {
      width: 50%;
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center; }
      @media screen and (max-width: 1199px) {
        .feetbl .feetbl_line .feetbl_l, .feetbl .feetbl_line .feetbl_r {
          width: 100% !important;
          padding-right: 0; } }
    .feetbl .feetbl_line .feetbl_l {
      border-right: 2px solid #0b308f;
      font-weight: 700; }
      @media screen and (max-width: 1199px) {
        .feetbl .feetbl_line .feetbl_l {
          border-right: none;
          border-bottom: 1px dashed #0b308f;
          margin-bottom: 15px;
          padding-bottom: 15px; } }
  @media screen and (max-width: 1199px) and (max-width: 640px) {
    .feetbl .feetbl_line .feetbl_l {
      margin-bottom: 10px;
      padding-bottom: 10px; } }

      .feetbl .feetbl_line .feetbl_l .feetbl_l_head {
        display: flex;
        align-items: center;
        margin-bottom: 3px; }
        .feetbl .feetbl_line .feetbl_l .feetbl_l_head img {
          margin-right: 8px; }
        @media screen and (max-width: 400px) {
          .feetbl .feetbl_line .feetbl_l .feetbl_l_head {
            margin-left: 48px; }
            .feetbl .feetbl_line .feetbl_l .feetbl_l_head img {
              display: none; } }
      .feetbl .feetbl_line .feetbl_l .feetbl_l_name {
        font-size: clamp(20px, 3vw, 30px);
        font-weight: 700;
        letter-spacing: 1px; }
    .feetbl .feetbl_line .feetbl_r .feetbl_r_dead {
      text-decoration: line-through;
      color: #767676;
      font-weight: 700;
      line-height: 1;
      padding-top: 7px; }
      .feetbl .feetbl_line .feetbl_r .feetbl_r_dead + .feetbl_r_add {
        color: #767676;
        font-size: 80%; }
    .feetbl .feetbl_line .feetbl_r .feetbl_r_down {
      color: #767676;
      line-height: 1.4;
      transform: scale(1, 0.6); }
      .feetbl .feetbl_line .feetbl_r .feetbl_r_down + .feetbl_r_fee + .feetbl_r_add {
        color: #ff6900;
        font-size: 80%; }
    .feetbl .feetbl_line .feetbl_r .feetbl_r_fee {
      line-height: 1;
      margin: 0.5em auto 0.8em;
      position: relative;
      display: flex;
      justify-content: center;
      align-items: flex-end; }
      .feetbl .feetbl_line .feetbl_r .feetbl_r_fee .txt_l {
        padding: 2px;
        display: inline-block;
        transform: scale(1, 0.95);
        letter-spacing: 1px;
        font-family: "Helvetica Neue", "Helvetica", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Arial", "Yu Gothic", "Meiryo", sans-serif;
        font-weight: 700;
        font-size: clamp(6px, 8vw, 40px);
        letter-spacing: 0;
        line-height: 0.7;
        margin: 0; }
      .feetbl .feetbl_line .feetbl_r .feetbl_r_fee + .feetbl_r_add {
        font-size: 80%; }
      .feetbl .feetbl_line .feetbl_r .feetbl_r_fee .getsugaku {
        margin: 0 0.3em 0 0; }
    .feetbl .feetbl_line.bg_lyl .feetbl_l_name {
      font-size: clamp(6px, 10vw, 53px);
      color: #fff100;
      text-shadow: -3px -2px 0 #0b308f, -3px -1px 0 #0b308f, -3px 0px 0 #0b308f, -3px 1px 0 #0b308f, -3px 2px 0 #0b308f, -2px -3px 0 #0b308f, -2px -2px 0 #0b308f, -2px -1px 0 #0b308f, -2px 0px 0 #0b308f, -2px 1px 0 #0b308f, -2px 2px 0 #0b308f, -2px 3px 0 #0b308f, -1px -3px 0 #0b308f, -1px -2px 0 #0b308f, -1px -1px 0 #0b308f, -1px 0px 0 #0b308f, -1px 1px 0 #0b308f, -1px 2px 0 #0b308f, -1px 3px 0 #0b308f, 0px -3px 0 #0b308f, 0px -2px 0 #0b308f, 0px -1px 0 #0b308f, 0px 0px 0 #0b308f, 0px 1px 0 #0b308f, 0px 2px 0 #0b308f, 0px 3px 0 #0b308f, 1px -3px 0 #0b308f, 1px -2px 0 #0b308f, 1px -1px 0 #0b308f, 1px 0px 0 #0b308f, 1px 1px 0 #0b308f, 1px 2px 0 #0b308f, 1px 3px 0 #0b308f, 2px -3px 0 #0b308f, 2px -2px 0 #0b308f, 2px -1px 0 #0b308f, 2px 0px 0 #0b308f, 2px 1px 0 #0b308f, 2px 2px 0 #0b308f, 2px 3px 0 #0b308f, 3px -2px 0 #0b308f, 3px -1px 0 #0b308f, 3px 0px 0 #0b308f, 3px 1px 0 #0b308f, 3px 2px 0 #0b308f; }
      @media screen and (max-width: 640px) {
        .feetbl .feetbl_line.bg_lyl .feetbl_l_name {
          padding: 10px 0;
          line-height: 1.1;
          text-shadow: -2px -1px 0 #0b308f, -2px 0px 0 #0b308f, -2px 1px 0 #0b308f, -1px -2px 0 #0b308f, -1px -1px 0 #0b308f, -1px 0px 0 #0b308f, -1px 1px 0 #0b308f, -1px 2px 0 #0b308f, 0px -2px 0 #0b308f, 0px -1px 0 #0b308f, 0px 0px 0 #0b308f, 0px 1px 0 #0b308f, 0px 2px 0 #0b308f, 1px -2px 0 #0b308f, 1px -1px 0 #0b308f, 1px 0px 0 #0b308f, 1px 1px 0 #0b308f, 1px 2px 0 #0b308f, 2px -1px 0 #0b308f, 2px 0px 0 #0b308f, 2px 1px 0 #0b308f; } }
    .feetbl .feetbl_line.bg_lyl .feetbl_r_fee {
      color: #ff6900; }
      .feetbl .feetbl_line.bg_lyl .feetbl_r_fee .txt_l {
        font-size: 62px;
        font-size: clamp(6px, 10vw, 62px); }

.cp-color-box2 .feetbl .feetbl_line.bg_lyl::before {
  content: none; }

/*
	.warifuki::after{
		display: block;
		content: "";
		width: 80px;
		height: 80px;
		background-size: contain;
		background-image: url("/commufa/common/img/fee_gigaotoku_fuki.png");
		position: absolute;
		right: -73px;
		top: -30px;
		@include mq(notpc){
		width: 75px;
		height: 75px;
		}
	}
*/
.link {
  background: linear-gradient(to right, #0b308e, #205baa);
  color: #fff; }
  .link .inner {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 120px; }
  .link .phone {
    margin: -5px 25px -10px 15px; }
    .link .phone .txt_l {
      font-size: clamp(20px, 3vw, 40px); }
    @media screen and (min-width: 1200px) {
      .link .phone img {
        width: 35px;
        height: 37px; } }
    .link .phone .exp {
      margin-bottom: -10px !important; }
  .inner .link {
    border-radius: 10px; }
  .link .flex > * {
    margin: 0; }

.btn {
  background-color: #ff6900;
  color: #fff;
  border-radius: 5px;
  box-shadow: 0 4px #cc5400;
  transition: .2s;
  transform: translateY(0px);
  cursor: pointer; }
  .btn:hover {
    background-color: #ff781a;
    box-shadow: 0 1px #cc5400;
    transform: translateY(3px); }
  .btn.normal {
    padding: 10px;
    margin: 20px auto;
    max-width: 300px; }
    .btn.normal::after {
      min-width: 16px;
      min-height: 16px;
      margin-left: 20px; }
  .btn.big {
    width: calc(100% - 20px);
    max-width: 600px;
    padding: 10px;
    margin: 40px auto;
    font-size: clamp(20px, 3vw, 30px); }
    @media screen and (max-width: 1199px) {
      .btn.big {
        margin: 20px auto; } }
    .btn.big::after {
      min-width: 40px;
      min-height: 40px;
      margin-left: 20px; }
  .btn.normal, .btn.big {
    text-decoration: none;
    font-weight: 700;
    display: flex;
    justify-content: center;
    align-items: center; }
    .btn.normal::after, .btn.big::after {
      display: inline-block;
      content: "";
      background-repeat: no-repeat;
      background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz48c3ZnIHZlcnNpb249IjEuMCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB2aWV3Qm94PSIwIDAgNTAgNTAiPjxwYXRoIGQ9Ik0yNS4xLjFDMTEuMy4xLjEgMTEuMy4xIDI1LjFzMTEuMiAyNSAyNSAyNSAyNS0xMS4yIDI1LTI1QzUwIDExLjMgMzguOC4xIDI1LjEuMXptLTcuNCAzNy43VjEzbDIxLjUgMTIuNC0yMS41IDEyLjR6IiBmaWxsPSIjRkZGIi8+PC9zdmc+"); }
  .btn.inc_img {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 10px; }
    .btn.inc_img img {
      object-fit: contain;
      max-height: 120px; }
  #hd_top .btn {
    height: 65px;
    width: 300px; }
  .link .btn:not(.gray) {
    height: 80px;
    width: 380px; }
  .link .btn.gray {
    margin-right: 15px;
    height: 80px;
    width: 220px;
    background-color: #f4f4f4;
    box-shadow: 0 4px #a6a6a6; }
    .link .btn.gray:hover {
      background-color: white;
      box-shadow: 0 1px #a6a6a6;
      transform: translateY(3px); }

header.area #hd_area {
  display: none; }
@media screen and (min-width: 1200px) {
  header:not(.area) {
    padding-top: 35px; } }
header:not(.area) #hd_area {
  width: 100%;
  background: #ecf1ff;
  text-align: center;
  color: #0b308f;
  font-size: 90%;
  padding: 4px 0; }
  @media screen and (min-width: 1200px) {
    header:not(.area) #hd_area {
      position: absolute;
      top: 0;
      left: 0;
      border-bottom: 1px solid #0b308f; } }
  @media screen and (min-width: 641px) and (max-width: 1199px) {
    header:not(.area) #hd_area {
      border-top: 2px solid #0b308f; } }
  header:not(.area) #hd_area a {
    color: #0b308f;
    font-weight: 700;
    border: 1px solid #0b308f;
    border-radius: 4px;
    text-decoration: none;
    padding: 0 5px;
    white-space: nowrap; }
header #hd_top {
  position: relative;
  margin: 0 auto;
  display: flex;
  align-items: center;
  height: 105px;
  max-width: 1200px; }
  @media screen and (min-width: 641px) and (max-width: 1199px) {
    header #hd_top {
      height: 74px;
      padding-left: 10px; } }
  @media screen and (max-width: 640px) {
    header #hd_top {
      height: 74px;
      padding-left: 10px; } }
  header #hd_top .logo {
    width: 235px;
    padding-right: 20px; }
    @media screen and (max-width: 1199px) {
      header #hd_top .logo {
        max-width: 170px;
        width: 48vw; } }
  header #hd_top #menubtn, header #hd_top #formlink {
    width: 74px;
    height: 74px;
    overflow: hidden;
    border-radius: 0;
    box-shadow: none;
    z-index: 10; }
    header #hd_top #menubtn img, header #hd_top #formlink img {
      position: absolute;
      max-width: unset;
      top: 10px; }
    header #hd_top #menubtn:hover, header #hd_top #formlink:hover {
      box-shadow: none;
      transform: translateY(0); }
  header #hd_top #menubtn {
    position: fixed;
    top: 0;
    right: 0;
    background-color: #fff100; }
    header #hd_top #menubtn img {
      width: 411px;
      transition: .2s;
      left: -261px; }
  header #hd_top #formlink {
    position: absolute;
    top: 0;
    right: 74px; }
    header #hd_top #formlink img {
      width: 411px;
      left: -189px; }
  header #hd_top #hd_top_company {
    line-height: 1.4;
    display: flex;
    align-items: center; }
    header #hd_top #hd_top_company br.mini {
      display: none; }
    @media screen and (max-width: 1199px) {
      header #hd_top #hd_top_company {
        padding-top: 4px; } }
  header #hd_top #hd_top_phone {
    position: absolute;
    top: 18px;
    right: 340px;
    line-height: 1.2; }
    header #hd_top #hd_top_phone img {
      position: absolute;
      top: -3px;
      left: 0; }
    header #hd_top #hd_top_phone .exp {
      padding-left: 34px; }
    header #hd_top #hd_top_phone .num {
      letter-spacing: 1px; }
  header #hd_top .btn {
    position: absolute;
    top: 19px;
    right: 10px; }
@media screen and (min-width: 641px) {
  header .company_name {
    color: #f76b1f; } }
@media screen and (max-width: 640px) {
  header .company_name {
    text-align: center;
    background: #0b308f;
    color: white;
    width: 100%;
    font-size: 12px;
    padding: 0 5px; } }
header #hd_nav {
  background: linear-gradient(#3152a2, #123692); }
  @media screen and (max-width: 1199px) {
    header #hd_nav {
      transform: translateX(-100%);
      position: fixed;
      top: 74px;
      left: 0;
      width: 100%;
      z-index: 10; } }
  header #hd_nav nav {
    margin: 0 auto;
    display: flex;
    max-width: 1200px;
    height: 70px;
    line-height: 105px;
    text-align: center; }
    @media screen and (max-width: 1199px) {
      header #hd_nav nav {
        flex-direction: column;
        line-height: 60px; } }
    header #hd_nav nav a {
      color: #fff;
      width: 170px;
      border-right: 2px solid #0c318f;
      text-decoration: none;
      position: relative; }
      @media screen and (max-width: 1199px) {
        header #hd_nav nav a {
          width: 100%;
          text-align: left;
          padding-left: 60px;
          background: linear-gradient(#3152a2, #123692);
          z-index: 2; } }
      header #hd_nav nav a:nth-child(1) {
        border-left: 2px solid #0c318f; }
      header #hd_nav nav a:hover {
        color: #fff100; }
      header #hd_nav nav a::before {
        content: "";
        display: block;
        position: absolute;
        top: 10px;
        left: 71px;
        width: 27px;
        height: 27px;
        background-image: url("/commufa/common/img/nav_icon.png");
        background-repeat: no-repeat;
        background-size: 411px 116px; }
        @media screen and (max-width: 1199px) {
          header #hd_nav nav a::before {
            display: inline-block;
            top: 15px;
            left: 15px; } }
      @media screen and (max-width: 1199px) {
        header #hd_nav nav a::after {
          content: "▶";
          position: absolute;
          display: inline-block;
          top: 0px;
          right: 15px; } }
      header #hd_nav nav a:nth-child(1)::before {
        background-position: 0px 0; }
      header #hd_nav nav a:nth-child(1):hover::before {
        background-position: 0px -27px; }
      header #hd_nav nav a:nth-child(2)::before {
        background-position: -27px 0; }
      header #hd_nav nav a:nth-child(2):hover::before {
        background-position: -27px -27px; }
      header #hd_nav nav a:nth-child(3)::before {
        background-position: -54px 0; }
      header #hd_nav nav a:nth-child(3):hover::before {
        background-position: -54px -27px; }
      header #hd_nav nav a:nth-child(4)::before {
        background-position: -81px 0; }
      header #hd_nav nav a:nth-child(4):hover::before {
        background-position: -81px -27px; }
      header #hd_nav nav a:nth-child(5)::before {
        background-position: -108px 0; }
      header #hd_nav nav a:nth-child(5):hover::before {
        background-position: -108px -27px; }
      header #hd_nav nav a:nth-child(6)::before {
        background-position: -135px 0; }
      header #hd_nav nav a:nth-child(6):hover::before {
        background-position: -135px -27px; }
      header #hd_nav nav a:nth-child(7)::before {
        background-position: -162px 0; }
      header #hd_nav nav a:nth-child(7):hover::before {
        background-position: -162px -27px; }
      header #hd_nav nav a:hover::before {
        animation: pyon .2s ease-in-out 0s 1 normal forwards; }
@-webkit-keyframes pyon {
  0% {
    transform: translateY(0); }
  50% {
    transform: translateY(-9px); }
  100% {
    transform: translateY(0); } }
@-webkit-keyframes in_l {
  0% {
    transform: translateX(-100%); }
  100% {
    transform: translateX(0); } }
@-webkit-keyframes out_l {
  0% {
    transform: translateX(0); }
  100% {
    transform: translateX(-100%); } }
@-webkit-keyframes in_t {
  0% {
    transform: translateY(-100%); }
  100% {
    transform: translateY(0); } }
@-webkit-keyframes out_t {
  0% {
    transform: translateY(0); }
  100% {
    transform: translateY(-100%); } }
@media screen and (max-width: 1199px) {
  header.on #hd_top_company, header.off #hd_top_company {
    position: fixed;
    top: 0;
    padding-left: 10px;
    margin-left: -10px;
    padding-top: 2px;
    display: block;
    width: 100%;
    height: 74px;
    z-index: 10; }
  header.on #formlink, header.off #formlink {
    position: fixed !important;
    top: 0;
    right: 74px;
    z-index: 11; }
  header.on #hd_nav::after, header.off #hd_nav::after {
    content: "";
    display: block;
    height: 100vh;
    width: 100%;
    position: absolute;
    background-color: #e6eaf4;
    top: 419px;
    left: 0; }
  header.on #hd_nav {
    animation: in_l .2s ease-in-out 0s 1 normal forwards; }
  header.on #hd_top_company, header.on #formlink {
    animation: in_t .2s ease-in-out 0s 1 normal forwards; }
  header.on #menubtn img {
    left: -335px !important; }
  header.off #hd_nav {
    animation: out_l .2s ease-in-out 0s 1 normal forwards; }
  header.off #hd_top_company, header.off #formlink {
    animation: out_t .2s ease-in-out 0s 1 normal forwards; }
  header.noscroll.off #hd_top_company, header.noscroll.off #formlink {
    animation: in_t .2s ease-in-out 0s 1 normal forwards; } }
header #breadcrumb {
  background: #e6eaf4;
  padding: 6px 0px 5px 0px; }
  @media screen and (max-width: 1199px) {
    header #breadcrumb {
      padding: 6px 5px 5px;
      border-top: 2px solid #0b308f;
      border-bottom: 2px solid #0b308f; } }
  header #breadcrumb #breadwrap {
    max-width: 1160px;
    margin: 0 auto;
    font-size: 14px; }
    @media screen and (max-width: 640px) {
      header #breadcrumb #breadwrap {
        font-size: 12px; } }
    header #breadcrumb #breadwrap a {
      color: #0b308f; }
      header #breadcrumb #breadwrap a:nth-child(1) {
        position: relative;
        padding-left: 19px; }
        header #breadcrumb #breadwrap a:nth-child(1)::before {
          position: absolute;
          top: 3px;
          margin-left: -19px;
          content: "";
          display: inline-block;
          width: 16px;
          height: 16px;
          background-image: url("/commufa/common/img/nav_icon.png");
          background-repeat: no-repeat;
          background-position: -268px -65px;
          background-size: 411px 116px; }

.camp_btn {
  display: inline-flex;
  margin: 0 auto 30px; }
  .camp_btn .btn {
    text-align: center;
    text-decoration: none;
    font-weight: 700;
    line-height: 1.2;
    padding: 10px;
    min-width: 300px;
    position: relative; }
    .camp_btn .btn:nth-child(1) {
      margin-right: 20px; }
    .camp_btn .btn.cb {
      background-color: #ff4840 !important; }
    .camp_btn .btn.game {
      background-color: #01cae6 !important;
      box-shadow: 0 4px #0094A8; }
      .camp_btn .btn.game:hover {
        box-shadow: 0 1px #0094A8; }
  @media screen and (max-width: 640px) {
    .camp_btn {
      width: 100%;
      display: flex;
      font-size: clamp(12px, 3vw, 16px); }
      .camp_btn .btn {
        padding: 10px 5px;
        min-width: unset;
        width: calc(50% - 2px); }
        .camp_btn .btn:nth-child(1) {
          margin-right: 5px; } }

footer #ft_link {
  border-top: 2px solid #f7f9ff;
  background-size: contain;
  background-image: url("/commufa/common/img/top_back_y1.png");
  padding: 45px 10px; }
  @media screen and (max-width: 1199px) {
    footer #ft_link .inner {
      max-width: 700px;
      padding-left: 0 !important;
      padding-right: 0 !important; } }
  footer #ft_link h2 {
    margin-bottom: 20px; }
  footer #ft_link .panda {
    margin-bottom: 20px;
    width: 150px;
    height: 178px; }
  @media screen and (max-width: 1199px) {
    footer #ft_link .link {
      background: unset; }
      footer #ft_link .link .inner {
        height: auto;
        flex-wrap: wrap; }
      footer #ft_link .link .btn.gray {
        width: calc(50% - 16px);
        margin: 8px;
        max-height: 15vw; }
      footer #ft_link .link .phone {
        background: linear-gradient(to right, #0b308e, #205baa);
        box-shadow: 0 4px #001E6E; }
        footer #ft_link .link .phone:hover {
          box-shadow: 0 1px #001E6E; }
      footer #ft_link .link .phone, footer #ft_link .link .web {
        width: calc(50% - 16px);
        margin: 8px;
        height: 20vw;
        max-height: 120px; }
      footer #ft_link .link .picture {
        line-height: 0; } }
@media screen and (max-width: 1199px) {
  footer #ft_nav {
    background: linear-gradient(to right, #0b308e, #205baa); }
    footer #ft_nav .inner {
      padding-left: 0;
      padding-right: 0; }
    footer #ft_nav .company {
      display: none; }
    footer #ft_nav dt {
      color: #fff;
      background: linear-gradient(to right, #0b308e, #205baa);
      border-top: 1px solid #fff;
      height: 45px;
      display: flex;
      align-items: center;
      position: relative;
      padding-left: 15px;
      font-weight: 700; } }
    @media screen and (max-width: 1199px) and (max-width: 1199px) {
      footer #ft_nav dt.ball_line::after, footer #ft_nav dt.ball_line::before {
        display: none; } }
@media screen and (max-width: 1199px) {
    footer #ft_nav dd {
      background-color: #e6eaf4;
      border-top: 1px solid #fff;
      position: relative;
      cursor: pointer;
      white-space: nowrap;
      overflow: hidden; }
      footer #ft_nav dd a {
        display: block;
        height: 100%;
        width: 100%;
        padding-left: 15px;
        color: #0b308f;
        text-decoration: none;
        height: 45px;
        display: flex;
        align-items: center;
        transition: .2s; }
        footer #ft_nav dd a::before {
          content: "";
          display: inline-block;
          width: 10px;
          height: 10px;
          margin-right: 3px;
          background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz48c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgdmlld0JveD0iMCAwIDUxMiA1MTIiPjxwYXRoIGQ9Ik0xNzEgNy4xYy0zLjktMy45LTEwLjMtMy45LTE0LjEgMEw5OS4yIDY0LjhjLTMuOSAzLjktMy45IDEwLjMgMCAxNC4xbDE3MCAxNzBjMy45IDMuOSAzLjkgMTAuMyAwIDE0LjFsLTE3MCAxNzBjLTMuOSAzLjktMy45IDEwLjMgMCAxNC4xbDU3LjcgNTcuN2MzLjkgMy45IDEwLjMgMy45IDE0LjEgMGwyNDEuOS0yNDEuOWMzLjktMy45IDMuOS0xMC4zIDAtMTQuMUwxNzEgNy4xeiIgZmlsbD0iIzBiMzA4ZSIvPjwvc3ZnPg=="); }
        footer #ft_nav dd a:hover {
          background-color: #fff100;
          font-weight: 700;
          color: #ff6900; }
          footer #ft_nav dd a:hover::before {
            background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz48c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgdmlld0JveD0iMCAwIDUxMiA1MTIiPjxwYXRoIGQ9Ik0xNzEgNy4xYy0zLjktMy45LTEwLjMtMy45LTE0LjEgMEw5OS4yIDY0LjhjLTMuOSAzLjktMy45IDEwLjMgMCAxNC4xbDE3MCAxNzBjMy45IDMuOSAzLjkgMTAuMyAwIDE0LjFsLTE3MCAxNzBjLTMuOSAzLjktMy45IDEwLjMgMCAxNC4xbDU3LjcgNTcuN2MzLjkgMy45IDEwLjMgMy45IDE0LjEgMGwyNDEuOS0yNDEuOWMzLjktMy45IDMuOS0xMC4zIDAtMTQuMUwxNzEgNy4xeiIgZmlsbD0iI0VENkQwMCIvPjwvc3ZnPg=="); } }
@media screen and (min-width: 1200px) {
  footer #ft_nav {
    padding: 45px 10px 170px 10px;
    background-color: #e6eaf4;
    background-image: url("/commufa/common/img/ft_back.png");
    background-repeat: repeat-x;
    background-position: bottom; }
    footer #ft_nav .inner {
      display: flex;
      flex-wrap: wrap;
      /*.ft_nav_link:nth-child(2){width: 185px;}
      .ft_nav_link:nth-child(3){width: 290px;}
      .ft_nav_link:nth-child(4){width: 217px;}
      .ft_nav_link:nth-child(5){width: 170px;}*/ }
      footer #ft_nav .inner .company {
        width: 270px; }
      footer #ft_nav .inner .ft_nav_link {
        width: fit-content; }
    footer #ft_nav .ft_nav_link {
      padding: 0 0px 0 12px;
      max-width: 325px; }
      footer #ft_nav .ft_nav_link dt {
        position: relative;
        font-weight: 700;
        font-size: 20px;
        padding: 0 0 12px 0;
        margin-bottom: 12px; }
      footer #ft_nav .ft_nav_link a {
        position: relative;
        font-size: 14px;
        text-decoration: none;
        color: #0b308f;
        display: inline-block;
        padding: 3px 18px 3px 10px;
        transition: .2s;
        border-radius: 2px; }
        footer #ft_nav .ft_nav_link a:hover {
          color: #fff;
          background-color: #0b308f; }
        footer #ft_nav .ft_nav_link a:hover::before {
          transition: .33s;
          background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz48c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgdmlld0JveD0iMCAwIDUxMiA1MTIiPjxwYXRoIGQ9Ik0xNzEgNy4xYy0zLjktMy45LTEwLjMtMy45LTE0LjEgMEw5OS4yIDY0LjhjLTMuOSAzLjktMy45IDEwLjMgMCAxNC4xbDE3MCAxNzBjMy45IDMuOSAzLjkgMTAuMyAwIDE0LjFsLTE3MCAxNzBjLTMuOSAzLjktMy45IDEwLjMgMCAxNC4xbDU3LjcgNTcuN2MzLjkgMy45IDEwLjMgMy45IDE0LjEgMGwyNDEuOS0yNDEuOWMzLjktMy45IDMuOS0xMC4zIDAtMTQuMUwxNzEgNy4xeiIgZmlsbD0iI2ZmZiIvPjwvc3ZnPg==");
          left: calc(100% - 14px); }
        footer #ft_nav .ft_nav_link a::before {
          top: 10px;
          left: 0;
          position: absolute;
          width: 10px;
          height: 10px;
          content: "";
          display: inline-block;
          background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz48c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgdmlld0JveD0iMCAwIDUxMiA1MTIiPjxwYXRoIGQ9Ik0xNzEgNy4xYy0zLjktMy45LTEwLjMtMy45LTE0LjEgMEw5OS4yIDY0LjhjLTMuOSAzLjktMy45IDEwLjMgMCAxNC4xbDE3MCAxNzBjMy45IDMuOSAzLjkgMTAuMyAwIDE0LjFsLTE3MCAxNzBjLTMuOSAzLjktMy45IDEwLjMgMCAxNC4xbDU3LjcgNTcuN2MzLjkgMy45IDEwLjMgMy45IDE0LjEgMGwyNDEuOS0yNDEuOWMzLjktMy45IDMuOS0xMC4zIDAtMTQuMUwxNzEgNy4xeiIgZmlsbD0iIzBiMzA4ZSIvPjwvc3ZnPg==");
          background-repeat: no-repeat;
          background-size: contain; } }
    @media screen and (min-width: 1200px) and (min-width: 1200px) {
      footer #ft_nav .ft_nav_link dd + dt {
        margin-top: 30px; } }
@media screen and (min-width: 1200px) {
    footer #ft_nav .company {
      position: relative; }
      footer #ft_nav .company img {
        max-width: 185px;
        margin-bottom: 10px; }
      footer #ft_nav .company::after {
        content: "";
        display: block;
        width: 1px;
        height: calc(100% + 20px);
        position: absolute;
        background-color: #8d9ecb;
        right: 13px;
        top: -10px; } }
footer #ft_last {
  position: relative;
  text-align: center;
  background: linear-gradient(to right, #0b308e, #205baa);
  color: white;
  padding-bottom: 25px;
  font-size: 12px; }
  @media screen and (max-width: 1199px) {
    footer #ft_last {
      padding-bottom: 85px; } }
  footer #ft_last .ft_last_link {
    display: flex;
    justify-content: center; }
    @media screen and (max-width: 640px) {
      footer #ft_last .ft_last_link {
        flex-wrap: wrap;
        margin: 0px auto;
        padding: 10px;
        background: linear-gradient(to right, #0b308e, #205baa); }
        footer #ft_last .ft_last_link > li {
          margin: 1%;
          display: block; }
          footer #ft_last .ft_last_link > li > a {
            margin: 0px;
            padding: 0px 5px;
            display: block;
            width: 100%;
            height: 100%; } }
    footer #ft_last .ft_last_link a {
      color: white;
      display: inline-block;
      padding: 10px;
      margin: 10px 10px 10px 10px;
      text-decoration: none; }
      footer #ft_last .ft_last_link a:hover {
        text-decoration: underline; }
  footer #ft_last #copy {
    font-size: 12px; }
footer #ft_btn {
  width: 100%;
  position: fixed;
  bottom: 0;
  left: 0;
  display: flex;
  height: 60px;
  background-color: #e6eaf4;
  border-top: 1px solid #0b308f;
  z-index: 11;
  transition: .2s;
  transform: translateY(100%); }
  footer #ft_btn.in {
    transform: translateY(0); }
  footer #ft_btn a {
    text-align: center;
    margin: 2px;
    border: 1px solid;
    border-radius: 2px;
    overflow: hidden;
    transition: .2s; }
    footer #ft_btn a .picture, footer #ft_btn a picture {
      text-align: center;
      display: inline-block;
      overflow: hidden;
      height: 54px;
      position: relative; }
      footer #ft_btn a .picture img, footer #ft_btn a picture img {
        width: 411px;
        height: 116px;
        max-width: unset;
        position: absolute; }
    footer #ft_btn a:hover {
      opacity: 0.8; }
  footer #ft_btn #ft_btn_fee {
    width: 15%;
    min-width: 67px;
    background-color: #f4f4f4;
    border-color: #a6a6a6; }
    footer #ft_btn #ft_btn_fee .picture {
      width: 64px; }
      footer #ft_btn #ft_btn_fee .picture img {
        left: 1px;
        top: -66px; }
  footer #ft_btn #ft_btn_area {
    width: 15%;
    min-width: 67px;
    background-color: #f4f4f4;
    border-color: #a6a6a6; }
    footer #ft_btn #ft_btn_area .picture {
      width: 64px; }
      footer #ft_btn #ft_btn_area .picture img {
        left: -63px;
        top: -66px; }
  footer #ft_btn #ft_btn_phone {
    width: 20%;
    min-width: 67px;
    background: linear-gradient(to right, #0b308e, #205baa);
    border-color: #0b308f; }
    footer #ft_btn #ft_btn_phone .picture {
      width: 64px; }
      footer #ft_btn #ft_btn_phone .picture img {
        left: -126px;
        top: -66px; }
  footer #ft_btn #ft_btn_web {
    width: 50%;
    background-color: #ff6900;
    border-color: #b84c00; }
    footer #ft_btn #ft_btn_web picture {
      width: 64px; }
      footer #ft_btn #ft_btn_web picture img {
        left: -196px;
        top: -66px; }
    @media screen and (min-width: 401px) {
      footer #ft_btn #ft_btn_web picture {
        width: auto;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 3px; }
        footer #ft_btn #ft_btn_web picture img {
          width: 100%;
          max-width: 322px;
          height: auto;
          max-height: 48px;
          position: relative;
          left: 0;
          top: 0; } }

#to_top {
  position: absolute;
  top: -40px;
  right: 15%;
  background-color: #1d55a6;
  color: white;
  width: 80px;
  height: 80px;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  text-decoration: none;
  font-family: "Helvetica Neue", "Helvetica", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Arial", "Yu Gothic", "Meiryo", sans-serif;
  font-weight: 700;
  letter-spacing: 3px;
  line-height: 1;
  font-size: 22px;
  flex-direction: column;
  transition: .2s; }
  #to_top:hover {
    background-color: #ff6900;
    width: 90px;
    height: 90px;
    margin-right: -5px;
    margin-top: -5px;
    letter-spacing: 4px;
    font-size: 24px; }
    #to_top:hover img {
      margin-top: -5px;
      transform: rotateY(180deg);
      width: 30px; }
  #to_top img {
    transition: .3s;
    width: 20px;
    margin-bottom: 5px; }

.tabel_after_plus, .tabel_after_minus {
  position: relative; }
  .tabel_after_plus::after, .tabel_after_minus::after {
    border-radius: 50%;
    position: absolute;
    display: block;
    left: 50%;
    bottom: -10px;
    transform: translateX(-50%);
    width: 20px;
    height: 20px;
    background-color: white;
    content: ""; }

.tabel_after_plus::after {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20version%3D%221.1%22%20id%3D%22_x32_%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20x%3D%220%22%20y%3D%220%22%20viewBox%3D%220%200%20512%20512%22%20style%3D%22width%3A256px%3Bheight%3A256px%3Bopacity%3A1%22%20xml%3Aspace%3D%22preserve%22%3E%3Cstyle%3E.st0%7Bfill%3A%234b4b4b%7D%3C%2Fstyle%3E%3Cpath%20class%3D%22st0%22%20d%3D%22M359.244%20224.004h-59.988c-6.217%200-11.258-5.043-11.258-11.258v-59.992c0-6.215-5.039-11.254-11.256-11.254h-41.486c-6.217%200-11.258%205.039-11.258%2011.254v59.992c0%206.215-5.039%2011.258-11.256%2011.258h-59.988c-6.219%200-11.258%205.039-11.258%2011.258v41.484c0%206.215%205.039%2011.258%2011.258%2011.258h59.988c6.217%200%2011.256%205.039%2011.256%2011.258v59.984c0%206.219%205.041%2011.258%2011.258%2011.258h41.486c6.217%200%2011.256-5.039%2011.256-11.258v-59.984c0-6.219%205.041-11.258%2011.258-11.258h59.988c6.217%200%2011.258-5.043%2011.258-11.258v-41.484c0-6.219-5.041-11.258-11.258-11.258z%22%20style%3D%22fill%3A%230b308f%22%2F%3E%3Cpath%20class%3D%22st0%22%20d%3D%22M256%200C114.613%200%200%20114.617%200%20256c0%20141.387%20114.613%20256%20256%20256%20141.383%200%20256-114.613%20256-256C512%20114.617%20397.383%200%20256%200zm0%20448c-105.871%200-192-86.129-192-192%200-105.867%2086.129-192%20192-192%20105.867%200%20192%2086.133%20192%20192%200%20105.871-86.133%20192-192%20192z%22%20style%3D%22fill%3A%230b308f%22%2F%3E%3C%2Fsvg%3E"); }

.tabel_after_minus::after {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20version%3D%221.1%22%20id%3D%22_x32_%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20x%3D%220%22%20y%3D%220%22%20viewBox%3D%220%200%20512%20512%22%20style%3D%22width%3A256px%3Bheight%3A256px%3Bopacity%3A1%22%20xml%3Aspace%3D%22preserve%22%3E%3Cstyle%3E.st0%7Bfill%3A%234b4b4b%7D%3C%2Fstyle%3E%3Cpath%20class%3D%22st0%22%20d%3D%22M359.77%20224.004H152.228c-5.928%200-10.732%204.804-10.732%2010.73v42.535c0%205.926%204.805%2010.734%2010.732%2010.734H359.77c5.928%200%2010.732-4.809%2010.732-10.734v-42.535c0-5.926-4.805-10.73-10.732-10.73z%22%20style%3D%22fill%3A%23ff6900%22%2F%3E%3Cpath%20class%3D%22st0%22%20d%3D%22M256%200C114.613%200%200%20114.617%200%20256c0%20141.387%20114.613%20256%20256%20256%20141.383%200%20256-114.613%20256-256C512%20114.617%20397.383%200%20256%200zm0%20448c-105.871%200-192-86.129-192-192%200-105.867%2086.129-192%20192-192%20105.867%200%20192%2086.133%20192%20192%200%20105.871-86.133%20192-192%20192z%22%20style%3D%22fill%3A%23ff6900%22%2F%3E%3C%2Fsvg%3E"); }

#newyear {
  max-width: 1000px;
  line-height: 1.4;
  font-size: 13px;
  border: 2px solid #ff6900;
  margin-bottom: 40px;
  transform: translateY(20px);
  margin-left: auto;
  margin-right: auto;
  padding: 0 10px 10px 10px;
  border-radius: 10px;
  text-align: center;
  background: #fff;
  overflow: hidden;
  width: calc(100% - 20px);
  left: 10px; }
  #newyear .red {
    color: #ff6900; }
  #newyear .bold {
    font-weight: 700; }
  #newyear .ny_title {
    display: block;
    background-color: #ff6900;
    color: #fff;
    width: calc(100% + 20px);
    text-align: center;
    margin-left: -10px;
    padding: 5px;
    margin-bottom: 10px; }
  @media screen and (max-width: 640px) {
    #newyear {
      text-align: left; } }

/*IE*/
@media all and (-ms-high-contrast: none) {
  .card_3, .card_2:not(.alone) {
    display: block !important; }

  .card_3 .title {
    margin: -10px 0 0 -10px !important; } }
/*startwari_dl*/
.startwari_dl_grid {
  max-width: 1090px;
  margin-left: auto;
  margin-right: auto;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(100px, 1fr)); }
  .startwari_dl_grid .startwari_dl dt, .startwari_dl_grid .startwari_dl dd {
    text-align: center;
    border: 1px solid #0b308f;
    margin-left: -1px;
    margin-top: -1px; }
  .startwari_dl_grid .startwari_dl dt {
    background: #e6eaf4; }

#campbnr {
  position: relative;
  overflow: hidden;
  background-image: url("/commufa/common/img/cb-bnr-bg.png");
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  text-align: center;
  height: 35vw;
  max-height: 330px;
  display: flex;
  justify-content: center;
  align-items: center; }
  #campbnr img {
    /*		height: 40vw;
    		max-height: 440px;*/
    object-fit: cover; }
  #campbnr #camp_text {
    position: absolute;
    left: 50%;
    top: 0;
    transform: translateX(-50%);
    user-select: none;
    pointer-events: none;
    width: 100%; }

#top #top_campaign .inner {
  max-width: 1020px;
  margin: auto; }

#top_campaign .cardwrap {
  padding: 0; }

.cp-content section:first-child {
  padding: 0; }

.campaign-block .card_2.alone.official {
  margin: 20px auto;
  transform: initial;
  left: 0; }
.campaign-block .card_2.alone.original {
  margin: 10px auto 20px;
  justify-content: initial;
  width: calc(100% - 20px); }
@media screen and (min-width: 641px) and (max-width: 1199px) {
  .campaign-block .card_2.alone {
    left: 0;
    transform: initial;
    margin: auto; } }
@media screen and (max-width: 640px) {
  .campaign-block .card_2.alone.original {
    margin-bottom: 50px; }
  .campaign-block .card_2.alone.official {
    margin-top: 10px !important; } }
.campaign-block .maru-plus {
  position: relative; }
.campaign-block .maru-plus:before, .campaign-block .maru-number:after {
  position: absolute;
  display: flex;
  width: clamp(32px, 3vw, 40px);
  height: clamp(32px, 3vw, 40px);
  background: #0b308f;
  border-radius: 40px;
  font-weight: bold;
  font-size: clamp(20px, 3vw, 22px);
  color: #fff;
  justify-content: center;
  align-items: center; }
.campaign-block .maru-plus:before {
  content: "+";
  right: clamp(-30px, -2.5vw, -16px);
  top: calc(50% - clamp(16px,1.5vw,20px));
  z-index: 3; }
.campaign-block .maru-number:after {
  content: "1";
  width: 50px;
  height: 50px;
  left: -2px;
  top: -6px;
  border-radius: 0;
  clip-path: polygon(100% 0, 100% 100%, 50% 87%, 0 100%, 0% 0%);
  background: #ff6900; }
.campaign-block .maru1:after {
  content: "1"; }
.campaign-block .maru2:after {
  content: "2"; }
.campaign-block .maru3:after {
  content: "3"; }
.campaign-block .maru4:after {
  content: "4"; }
@media screen and (min-width: 641px) and (max-width: 1199px) {
  .campaign-block .maru-plus:before {
    bottom: calc(50% - 10px); } }
.campaign-block .yoko2-wrap {
  width: calc(70% - 20px) !important;
  max-width: initial !important; }
.campaign-block .card_2.yoko {
  flex-direction: row;
  margin-right: 0;
  line-height: 1.6;
  margin-bottom: 10px; }
.campaign-block .card_2.yoko:last-child {
  margin-bottom: 0; }
.campaign-block .card_2.yoko .img {
  width: 60%;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 10px; }
.campaign-block .card_2.yoko .img img {
  height: 100%;
  object-fit: cover; }
.campaign-block .card_2.yoko .below {
  width: 40%; }
.campaign-block .card_2.tate {
  width: calc(30% - 20px); }
.campaign-block .card_2.yoko .exp, .campaign-block .card_2.tate .exp {
  padding: 10px !important; }
.campaign-block .maru-or {
  overflow: initial !important; }
@media screen and (max-width: 800px) {
  .campaign-block .yoko2-wrap {
    width: 100% !important;
    background: #ffdabd;
    padding: 20px 5%;
    margin-top: 30px; }
  .campaign-block .card_2.tate {
    width: calc(40% - 0px); }
  .campaign-block .card_2.yoko {
    flex-direction: column; }
  .campaign-block .card_2.yoko .img {
    width: 100%;
    padding: 0; }
  .campaign-block .card_2.yoko .below {
    width: 100%; }
  .campaign-block .maru-plus:nth-child(1):before {
    content: "or";
    font-size: clamp(18px, 2.5vw, 22px);
    right: calc(50% - clamp(16px, 5vw, 20px));
    top: calc(100% - 12px); }
  .campaign-block .maru-plus:nth-child(2):before {
    right: calc(50% - clamp(16px, 5vw, 20px));
    top: calc(100% + 15px); }
  .campaign-block .maru-number:after {
    width: clamp(34px, 12vw, 50px);
    height: clamp(34px, 12vw, 50px);
    left: -6px;
    top: -8px; }
  .campaign-block .card_2.tate {
    width: calc(100% - 20px); } }

.cp-lp_campaign-block .card_2.alone.official {
  margin: 20px auto;
  transform: initial;
  left: 0; }
.cp-lp_campaign-block .card_2.alone.original {
  margin: 10px auto 20px;
  justify-content: initial;
  width: calc(100% - 20px); }
@media screen and (min-width: 641px) and (max-width: 1199px) {
  .cp-lp_campaign-block .card_2.alone {
    left: 0;
    transform: initial;
    margin: auto; } }
@media screen and (max-width: 640px) {
  .cp-lp_campaign-block .card_2.alone.original {
    margin-bottom: 50px; }
  .cp-lp_campaign-block .card_2.alone.official {
    margin-top: 10px !important; } }

@media screen and (max-width: 1199px) {
  #top_campaign .cp-lp_campaign-block {
    margin: 0 10px; } }

/*メディア情報*/
#media_area {
  padding-top: 45px;
  padding-bottom: 20px;
  background: #f7f9ff; }
  #media_area .p-inner {
    max-width: 1100px;
    position: relative;
    padding: 0 10px !important;
    margin-left: auto;
    margin-right: auto; }
    #media_area .p-inner::before {
      position: absolute;
      left: 10px;
      top: -30px;
      content: "メディア情報";
      font-weight: 700;
      color: #0b308f; }
  #media_area #media_area_list {
    max-height: 90px;
    overflow-y: scroll;
    font-size: 90%;
    padding: 10px 20px;
    background: white;
    border-radius: 5px;
    line-height: 1.6; }
    #media_area #media_area_list .u-date {
      font-weight: 700; }
    @media screen and (min-width: 1200px) {
      #media_area #media_area_list li {
        display: flex; } }
    @media screen and (max-width: 1199px) {
      #media_area #media_area_list .u-date, #media_area #media_area_list .u-text {
        display: block; }
      #media_area #media_area_list li {
        padding-top: 10px;
        padding-bottom: 10px; }
        #media_area #media_area_list li:first-of-type {
          padding-top: 0; }
        #media_area #media_area_list li:last-of-type {
          padding-bottom: 0; }
        #media_area #media_area_list li:not(:last-of-type) {
          border-bottom: 1px solid #e8e8e8; } }