@charset "UTF-8";

/*
npm i -S html5-reset normalize.css
====================================================
  ■                                                        
  ■                                     ■            ■■    
  ■         ■■■■■■■      ■■■■■■■        ■              ■   
  ■             ■            ■         ■■   ■      ■       
  ■            ■            ■       ■■■■■■■  ■     ■       
  ■                                    ■  ■  ■■    ■       
  ■                                   ■■  ■   ■    ■ ■■■■■ 
  ■         ■            ■            ■   ■        ■■■   ■■
■ ■ ■      ■            ■             ■   ■        ■      ■
 ■■■        ■            ■           ■    ■              ■■
 ■■■         ■■■■■■■      ■■■■■■■    ■ ■■■           ■■■■■ 
  ■                                                        
====================================================

*/

.l-wrapper {
  max-width: 1040px;
  margin-right: auto;
  margin-left: auto;
}

.firstView {
  width: 100%;
  margin-bottom: 115px;
  background: linear-gradient(0deg, #f3eee4 -15%, #eac200 50%);
}

.firstView img {
  width: 100%;
}

.firstView .inner__wrap {
  color: white;
}

.dataBar {
  background: #412c0d;
}

.dataBar .inner__wrap {
  display: flex;
  justify-content: center;
  margin-right: auto;
  margin-left: auto;
  padding-top: 35px;
  padding-bottom: 35px;
  background: none;
}

.dataBar * {
  margin-top: 0;
  margin-bottom: 0;
}

.btn-module {
  margin-top: 80px;
  margin-bottom: 60px;
}

.btn-module a img {
  max-width: 100%;
  margin: 0 auto;
  opacity: 1;
  transition: .2s;
}

.btn-module span {
  display: block;
}

.btn-module span img {
  max-width: 100%;
  margin: 0 auto;
  opacity: 1;
  transition: .2s;
  opacity: 0.3;
}

.btn-module a:hover img {
  opacity: .8;
}

.ap-btn {
  text-align: center;
}

.ap-btn a {
  display: inline-block;
}

.act-container {
  display: block;
  color: #4a3419;
}

.act-module {
  position: relative;
  margin-top: 45px;
  border: 1px solid #4a3419;
}

.act-module h3 {
  position: absolute;
  top: -56px;
  left: 50%;
  justify-content: center;
  width: 360px;
  padding: 5px 80px 20px;
  transform: translateX(-50%);
  background: url(../ribbon.png) no-repeat;
  background-position: center;
  color: white;
  font-size: 1.15em;
  text-align: center;
}

.act-module + .act-module {
  margin-top: 105px;
}

.col-container {
  margin: 0;
  padding: 45px 59px;
}

.col-container ul,
.col-container li {
  list-style: none;
}

.col-module {
  display: flex;
}

.col-module .col_lavel {
  width: 25%;
  margin-right: 20px;
  font-weight: 600;
  font-size: 20px;
}

.col-module .col_value {
  width: calc(100% - 25% - 20px);
  font-size: .85em;
}

.col-module .col_value p {
  margin: 0;
  font-size: 15px;
  line-height: 2;
}

.col-module .col_value mark {
  display: inline;
  background: none;
  color: #fe0003;
}

.col-module .col_value a {
  color: #1556d7;
  text-decoration: underline;
}
.col-module .col_value a:hover {
  text-decoration: none;
}

.col-module .col_value .comment,
.col-module .col_value .list {
  display: flex;
}

.col-module .col_value .comment::before {
  content: "※";
}

.col-module .col_value .list::before {
  content: "・";
}

.col-module + .col-module {
  margin-top: 30px;
  padding-top: 30px;
  border-top: 1px #4a3419 dashed;
}

@keyframes fadeIn {
  0% {
    position: relative;
    top: 20px;
    opacity: 0;
  }

  100% {
    top: 0;
    opacity: 1;
  }
}

.is-dsp-pc {
  display: block;
}

.is-dsp-sp {
  display: none;
}

.is-setFix {
  position: fixed;
}

/* .is-no-grid .col-container {
  padding-left: 0;
} */

.is-no-grid .col-module {
  flex-wrap: wrap;
  text-align: center;
}

.is-no-grid .col-module .col_lavel,
.is-no-grid .col-module .col_value {
  width: 100%;
  margin-right: 0;
}

.is-no-grid .col-module .col_lavel {
  font-size: .85em;
}

.is-no-grid .col-module a {
  color: #4a3419;
}
.col-module .col_value p.mt1em {
  margin-top: 1em;
}

@media screen and (max-width: 48em) {
  .l-wrapper {
    max-width: 100%;
  }

  .dataBar .inner__wrap {
    padding-top: calc(25 / 750 * 100vw);
    padding-right: calc(30 / 750 * 100vw);
    padding-bottom: calc(30 / 750 * 100vw);
    padding-left: calc(30 / 750 * 100vw);
  }

  .act-module {
    margin: calc(120 / 750 * 100vw) calc(30 / 750 * 100vw) calc(60 / 750 * 100vw);
  }

  .act-module h3 {
    top: calc(-105 / 750 * 100vw);
    width: 100vw;
    padding: calc(20 / 750 * 100vw) 0 calc(45 / 750 * 100vw);
    background-size: calc(500 / 750 * 100vw);
    font-size: 1.25em;
  }

  .act-module + .act-module {
    margin-top: calc(120 / 750 * 100vw);
  }

  .col-container {
    padding: calc(90 / 750 * 100vw) calc(20 / 750 * 100vw) calc(90 / 750 * 100vw);
  }

  .col-module {
    flex-wrap: wrap;
  }

  .col-module .col_lavel {
    width: 100%;
    font-size: 16px;
    margin-bottom: 5px;
  }

  .col-module .col_value {
    width: 100%;
  }

  .col-module .col_value p {
    margin: 0;
    font-size: 13px;
    line-height: 1.4;
  }

  .col-module + .col-module {
    margin-top: calc(30 / 750 * 100vw);
    padding-top: calc(30 / 750 * 100vw);
  }

  .firstView {
    margin-bottom: calc(140 / 750 * 100vw);
  }

  .btn-module {
    box-sizing: border-box;
    width: calc(680 / 750 * 100vw);
    margin-top: calc(100 / 750 * 100vw);
    margin-bottom: 0;

    padding: 0 calc(30 / 750 * 100vw);
  }

  .is-dsp-pc {
    display: none;
  }

  .is-dsp-sp {
    display: block;
  }

  .is-spaceBlock {
    display: none;
  }

  .col-module .col_value .comment,
  .col-module .col_value .list {
    display: block;
    margin-left: 1em;
    text-indent: -1em;
  }
  .col-module .col_value p.mt1em {
    margin-top: 0;
  }
  

}