/*_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/

Guide CSS

_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/*/
/*_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/

Variables CSS

_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/*/
/* Variables
-------------------------------------------- */
/* Content
-------------------------------------------- */
#container .main_visual + .section_block {
  margin-top: -60px; }
@media (max-width: 640px) {
  #container .main_visual .visualCont {
    padding-bottom: 40px; } }
#container .ttlWrap h2 {
  margin-top: 50px;
  font-size: 4.0rem;
  font-weight: bold;
  text-align: center; }
  #container .ttlWrap h2 span {
    color: #c84e96; }
  @media (max-width: 640px) {
    #container .ttlWrap h2 {
      margin-top: 30px;
      font-size: 4.8vw; } }
#container .section-heading__ttl span {
  font-size: 70%; }
#container .guide-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between; }
  #container .guide-list > .list {
    width: calc(33.33% - 13px); }
    #container .guide-list > .list:nth-child(n+4) {
      margin-top: 20px; }
    @media screen and (max-width: 960px) {
      #container .guide-list > .list {
        width: calc(50% - 20px); }
        #container .guide-list > .list:nth-child(n+3) {
          margin-top: 20px; } }
    @media (max-width: 640px) {
      #container .guide-list > .list {
        width: 100%; }
        #container .guide-list > .list:nth-child(n+2) {
          margin-top: 15vw; } }
    #container .guide-list > .list > .ttl > a {
      display: block;
      padding: 10px 0;
      font-size: 2.4rem;
      text-align: center;
      color: #FFF;
      background: #3d62ac; }
      @media (max-width: 640px) {
        #container .guide-list > .list > .ttl > a {
          font-size: 2.0rem; } }
    #container .guide-list > .list > .description .list {
      padding-bottom: 10px;
      display: flex;
      flex-wrap: wrap;
      justify-content: space-between; }
      #container .guide-list > .list > .description .list .ttl {
        width: 100px;
        padding-top: 10px;
        font-size: 1.6rem;
        color: #3d62ac; }
        @media (max-width: 640px) {
          #container .guide-list > .list > .description .list .ttl {
            width: 80px;
            font-size: 1.4rem; } }
      #container .guide-list > .list > .description .list .description {
        padding-top: 10px;
        width: calc(100% - 110px);
        font-size: 1.4rem; }
        @media (max-width: 640px) {
          #container .guide-list > .list > .description .list .description {
            width: calc(100% - 90px); } }
        #container .guide-list > .list > .description .list .description span {
          color: #c84e96; }
    #container .guide-list > .list .caption {
      padding-top: 20px;
      border-top: 1px solid #aaa;
      font-size: 1.4rem; }
      #container .guide-list > .list .caption span {
        color: #c84e96; }
#container .scene-wrap {
  margin-top: 60px;
  display: flex;
  flex-wrap: wrap; }
  #container .scene-wrap > div {
    width: 33.33%; }
    @media (max-width: 640px) {
      #container .scene-wrap > div {
        width: 100%; } }
    #container .scene-wrap > div.middle {
      display: flex;
      flex-wrap: wrap; }
      #container .scene-wrap > div.middle .small {
        width: 50%; }
      #container .scene-wrap > div.middle .wide {
        width: 100%; }
#container .table-wrap {
  width: 100%;
  overflow: auto; }
  #container .table-wrap ul.table {
    width: 100%;
    min-width: 1080px; }
    #container .table-wrap ul.table li {
      display: flex;
      justify-content: flex-end;
      align-items: top; }
      #container .table-wrap ul.table li div {
        position: relative;
        width: calc(12.5% - 22.5px);
        border-top: 1px solid #aaa;
        padding: 10px 5px;
        text-align: center; }
        #container .table-wrap ul.table li div::after {
          position: absolute;
          content: "";
          right: 0;
          top: 5px;
          width: 1px;
          height: calc(100% - 10px);
          background: #aaa; }
      #container .table-wrap ul.table li .blank, #container .table-wrap ul.table li .ttl {
        width: 170px;
        margin-left: 0;
        margin-right: auto; }
        #container .table-wrap ul.table li .blank::after, #container .table-wrap ul.table li .ttl::after {
          content: none; }
      #container .table-wrap ul.table li .blank::after {
        content: none; }
      #container .table-wrap ul.table li .ttl {
        border-top: 1px solid #3d62ac;
        border-right: none; }
      #container .table-wrap ul.table li .category {
        display: flex;
        justify-content: center;
        align-items: center; }
        #container .table-wrap ul.table li .category::after {
          content: none; }
        #container .table-wrap ul.table li .category span {
          display: block;
          font-size: 0.78em; }
      #container .table-wrap ul.table li .double {
        width: calc(25% - 45px); }
      #container .table-wrap ul.table li.total {
        color: #0f3174;
        font-weight: bold; }
        #container .table-wrap ul.table li.total div {
          border-bottom: 1px solid #aaa; }
        #container .table-wrap ul.table li.total .ttl {
          border-bottom: 1px solid #3d62ac; }
  #container .table-wrap.campaign ul.table li div {
    width: calc(16.66% - 30px); }
    #container .table-wrap.campaign ul.table li div img {
      display: block;
      max-width: 39px;
      margin: 0 auto; }
      @media (max-width: 640px) {
        #container .table-wrap.campaign ul.table li div img {
          max-width: 20px; } }
  #container .table-wrap.campaign ul.table li .blank, #container .table-wrap.campaign ul.table li .ttl {
    width: 170px; }
  #container .table-wrap.campaign ul.table li:last-child div {
    border-bottom: 1px solid #aaa; }
  #container .table-wrap.campaign ul.table li:last-child .ttl {
    border-bottom: 1px solid #3d62ac; }
#container .section_block.campaign .caption {
  margin: 10px auto 30px;
  font-size: 2.0rem;
  color: #3dbcc7;
  text-align: center; }
  #container .section_block.campaign .caption img {
    display: inline-block;
    max-width: 30px;
    padding-right: 5px;
    vertical-align: middle; }
  @media (max-width: 640px) {
    #container .section_block.campaign .caption {
      margin: 10px auto 20vw;
      font-size: 1.4rem; } }
#container .section_block.campaign .cruise-wrap {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between; }
  #container .section_block.campaign .cruise-wrap .img-wrap {
    position: relative;
    width: 33.33%;
    background: url("../img/guide/img_cruise.jpg") center bottom no-repeat;
    background-size: cover; }
    @media (max-width: 640px) {
      #container .section_block.campaign .cruise-wrap .img-wrap {
        width: 100%;
        height: 62.5vw; } }
    #container .section_block.campaign .cruise-wrap .img-wrap span {
      display: block;
      position: absolute;
      width: 50%;
      top: 0;
      right: 0;
      padding: 4px 0 10px 0;
      font-size: 2.4rem;
      color: #3d62ac;
      text-align: center;
      background: #f6f6f6; }
      @media (max-width: 640px) {
        #container .section_block.campaign .cruise-wrap .img-wrap span {
          font-size: 1.8rem;
          padding: 0 0 4px;
          right: auto;
          left: 0; } }
  #container .section_block.campaign .cruise-wrap .txt-wrap {
    width: calc(66.66% - 40px); }
    @media (max-width: 640px) {
      #container .section_block.campaign .cruise-wrap .txt-wrap {
        width: 100%;
        margin-top: 20px; } }
    #container .section_block.campaign .cruise-wrap .txt-wrap .lead {
      font-size: 2.4rem;
      color: #3dbcc7; }
      @media (max-width: 640px) {
        #container .section_block.campaign .cruise-wrap .txt-wrap .lead {
          font-size: 1.8rem; } }
    #container .section_block.campaign .cruise-wrap .txt-wrap h3 {
      margin-bottom: 30px;
      padding: 4px 10px;
      font-size: 3.6rem;
      font-weight: bold;
      color: #3dbcc7;
      background: #d8edee; }
      @media screen and (max-width: 960px) {
        #container .section_block.campaign .cruise-wrap .txt-wrap h3 {
          font-size: 3.6vw; } }
      @media (max-width: 640px) {
        #container .section_block.campaign .cruise-wrap .txt-wrap h3 {
          font-size: 6.0vw; } }
      #container .section_block.campaign .cruise-wrap .txt-wrap h3 + p span {
        color: #c84e96; }