@charset "UTF-8";
/* =======================================

	2013年度スペシャルコンテンツ:
  CMに登場、活躍した装備・部隊

======================================= */
/* body {
  width:900px;
} */
#modal_unit {
  
}

#modal_tag_name {
  padding: 30px 30px 0px 47px;
  font-size: 125%;
  line-height: 1;
  color: #000;
  /* background-color: #00a59f;  */
}
#modal_tag_name p {
  font-size: 20px;
  font-weight: 900;
  line-height: 34px; 
  letter-spacing: 1px;
}

/* Modal内コンテンツ領域
 ------------------------------------------------*/
#modal_cont_wrapper {
  padding:18px 53px 47px 47px;
  zoom: 1; 
  }
  #modal_cont_wrapper:after {
    display: table;
    clear: both;
    content: ""; }
  #modal_cont_wrapper:before {
    display: table;
    content: ""; }
  #modal_cont_wrapper #modal_cont_left {
    width: 100%; }
    #modal_cont_wrapper #modal_cont_left h1 {
      font-size: 30px;
      font-style: normal;
      font-weight: 700;
      line-height: normal;
      letter-spacing: 1.5px;
      margin-bottom:16px;
    }
    #modal_cont_wrapper #modal_cont_left #entrist_name {
      font-size: 16px;
      font-weight: 500;
      line-height: 28px; 
      letter-spacing: 0.8px;
      margin-bottom: 43px;
      
    }
    #modal_cont_wrapper p.std {
      color:#4B4B4B;
      font-size: 16px;
      font-weight: 500;
      line-height: 28px; 
      letter-spacing: 0.8px;
    }
  #modal_cont_wrapper #modal_cont_contents {
      display:flex;
      flex-direction:row;
      column-gap:38px;
  }
    #modal_cont_wrapper #modal_cont_contents_photos {
      display:flex;
      flex-direction:column;
      row-gap:30px;
    }
  #modal_cont_wrapper #modal_cont_right {
    height:161px;
    width: 100%; }
    #modal_cont_wrapper #modal_cont_right .modal_figure {
      zoom: 1;
      margin-bottom: 30px;
      float: left; }
      #modal_cont_wrapper #modal_cont_right .modal_figure:after {
        display: table;
        clear: both;
        content: ""; }
      #modal_cont_wrapper #modal_cont_right .modal_figure:before {
        display: table;
        content: ""; }

/* Elements */
.area_ovl_btn {
  clear: both;
  margin-top: 30px !important;
  background: #f5f5f5;
  padding-top:19px !important;
  padding-bottom:32px !important;
  display:flex;
  justify-content:center;
  
  border-radius: 8px; }
  .area_ovl_btn > div {
    display:flex;
    flex-direction:row;
    column-gap:40px;
  }
  .area_ovl_btn p {
    text-align:center;
    font-size: 16px;
    font-weight: 700;
    line-height: 28px;
    letter-spacing: 0.8px;
  }
  .area_ovl_btn .btn_tonavi {
    width: 40%;
    display: inline-block; }
    .area_ovl_btn .btn_tonavi a {
      display: flex;
      align-items: center;
      justify-content:center;
      margin-top:17px;
      width:340px;
      height: 60px;
      font-size: 16px;
      font-weight: 900;
      line-height: 34px; 
      letter-spacing: 0.8px;
      color: #fff;
      background: #000;
      position: relative;
      border-bottom:5px solid;
      border-image:linear-gradient(to left, #36BDEF, #08287E,#1EAA39) 1;
    }
    .area_ovl_btn .btn_tonavi a:hover{
      opacity:0.7;
    }
      .area_ovl_btn .btn_tonavi a::after {
        content: "";
        display: block;
        position: absolute;
        top: 50%;
        right: 30px;
        transform:translateY(-50%) rotate(45deg);
        width: 12px;
        height: 12px;
        border-top: solid 4px #fff;
        border-right: solid 4px #fff;
      }
      .area_ovl_btn .btn_tonavi a:hover {
        text-decoration: none !important;
      }

@media (max-width: 768px){
  #modal_tag_name {
    padding: 20px 20px 0px 20px;
    font-size: 125%;
    line-height: 1;
    color: #000;
    /* background-color: #00a59f;  */
  }
  #modal_tag_name p {
    font-size: 16px;
    font-weight: 400;
    line-height: 20px; 
    letter-spacing: 0.8px;
  }

  /* Modal内コンテンツ領域
 ------------------------------------------------*/
 #modal_cont_wrapper {
  padding:20px 20px 40px 20px;
  zoom: 1; 
  }
  #modal_cont_wrapper #modal_cont_left h1 {
    font-size: 16px;
    font-weight: 900;
    line-height: 20px; 
    letter-spacing: 0.8px;
    margin-bottom:12px;
  }
  #modal_cont_wrapper #modal_cont_left #entrist_name{
    font-size: 12px;
    font-weight: 500;
    line-height: 22px; 
    letter-spacing: 0.6px;
    margin-bottom: 30px;
  }
  #modal_cont_wrapper p.std {
    font-size: 12px;
    line-height: 22px; 
    letter-spacing: 0.6px;
  }
  #modal_cont_wrapper #modal_cont_contents {
    flex-direction:column;
    row-gap:30px;
  }
  #modal_cont_wrapper #modal_cont_contents_photos{
    margin-inline:auto;
  }
        
  /* Elements */
  .area_ovl_btn {
    padding-top:16px !important;
    padding-bottom:20px !important;
  }
  .area_ovl_btn > div {
    flex-direction:column;
    row-gap:12px;
  }
  .area_ovl_btn p {
    font-size: 12px;
    line-height: 22px; 
    letter-spacing: 0.6px;
  }
  .area_ovl_btn .btn_tonavi a {
    font-size: 12px;
    font-weight: 900;
    line-height: 34px; 
    letter-spacing: 0.6px;
    margin-top:10px;
    width:270px;
    height: 50px;
  }
  .area_ovl_btn .btn_tonavi a::after {
    right: 17px;
    width: 10px;
    height: 10px;
    border-top: solid 3px #fff;
    border-right: solid 3px #fff;
  }
}