@charset "utf-8";
/*--------------------
- common
--------------------*/

html,
body {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    border: none;
}

body {
    background-color: #fff !important;
}

body.bg-color {
    background-color: #f7f7f7 !important;
}

body::before {
    content: '';
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 30%;
    background-color: #fff;
}
#story *{
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
}
#story img{
    width: 100%;
}
#story figure{
    margin: 0;
}
.ff-page #wrapContent .breadcrumb {
    margin-top: 4px;
}
/*--------------------
- layout
--------------------*/
.l-column{
    max-width: 943px;
    width: 100%;
    margin: 0 auto;
    padding: 0 10px;
}
.l-column-wide{
    max-width: 1220px;
    width: 100%;
    margin: 0 auto;
    padding: 0 10px;
}
@media print, screen and (max-width: 640px) {
    .l-column{
        max-width: 100%;
        padding: 0 5%;
    }
    .l-column-wide{
        max-width: 100%;
        padding: 0 5%;
    }
}
/*--------------------
- modules
--------------------*/
/*--------------------
- section
--------------------*/
.section{
    margin-bottom: 70px;
}
.section:last-child{
    margin-bottom: 0;
}
.section_head{
    margin-bottom: 60px;
}
.section_body_item{
    margin-bottom: 50px;
}
.section_body_item:last-child{
    margin-bottom: 0;
}
.section_end{
    border-top: 1px solid #c3c3c3;
    padding-top: 25px;
}
.section_end_text{
    text-align: right;
}
.bnrArea {
    padding: 0 20px;
}

.bnrListFullWidth {
    max-width: 976px;
    width: 100%;
    margin: 0 auto 37px;
}

.bnrListFullWidth li {
    margin-bottom: 20px;
}

.bnrListFullWidth li:last-child {
    margin-bottom: 5%;
}
.sp-only {
    display: none;
}

.pc-only {
    display: block;
}

@media print, screen and (max-width: 600px) {
.bnrListFullWidth li img {
    width: 100%;
    height: auto;
}

.bnrListFullWidth li {
    margin-bottom: 2%;
}
.sp-only{
    display: block;
}
.pc-only{
    display: none;
}
}
@media print, screen and (max-width: 640px) {
    .section{
        margin-bottom: 15%;
    }
    .section_head{
        margin-bottom: 10%;
    }
    .section_body_item{
        margin-bottom: 7%;
    }
    .section_end{
        padding-top: 4%;
    }

    .section_end_text {
        font-size: 1.875vw;
    }
}
/*--------------------
- article
--------------------*/
.article{
    background-color: #eeeeee;
    padding: 60px 40px 40px;
    margin-bottom: 70px;
}
.article_head{
    margin-bottom: 50px;
}
@media print, screen and (max-width: 640px) {
    .article{
        padding: 10% 5%;
        margin-bottom: 7%;
    }
    .article_head{
        margin-bottom: 10%;
    }
}
/*--------------------
- heading
--------------------*/

.headingBorderLeft {
    font-size: 24px;
    line-height: 1.2;
    color: #666666;
    padding-left: 20px;
    border-left: 3px solid #999999;
}
.headingBorderBottom {
    font-size: 24px;
    line-height: 1.2;
    color: #666666;
    text-align: center;
    padding-bottom: 20px;
    border-bottom: 1px solid #666;
}
.headingBorderTopBottom {
    font-size: 18px;
    line-height: 1.2;
    color: #666666;
    text-align: center;
    padding: 8px 0;
    position: relative;
}
.headingBorderTopBottom:before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    width: 100%;
    height: 1px;
    margin: 0 auto;
    text-align: center;
    background: -moz-linear-gradient(left, rgba(153,153,153,0) 0%, rgba(153,153,153,1) 25%, rgba(153,153,153,1) 75%, rgba(153,153,153,0) 100%);
background: -webkit-linear-gradient(left, rgba(153,153,153,0) 0%,rgba(153,153,153,1) 25%,rgba(153,153,153,1) 75%,rgba(153,153,153,0) 100%);
background: linear-gradient(to right, rgba(153,153,153,0) 0%,rgba(153,153,153,1) 25%,rgba(153,153,153,1) 75%,rgba(153,153,153,0) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00999999', endColorstr='#00999999',GradientType=1 );
}
.headingBorderTopBottom:after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 1px;
    margin: 0 auto;
    text-align: center;
    background: -moz-linear-gradient(left, rgba(153,153,153,0) 0%, rgba(153,153,153,1) 25%, rgba(153,153,153,1) 75%, rgba(153,153,153,0) 100%);
background: -webkit-linear-gradient(left, rgba(153,153,153,0) 0%,rgba(153,153,153,1) 25%,rgba(153,153,153,1) 75%,rgba(153,153,153,0) 100%);
background: linear-gradient(to right, rgba(153,153,153,0) 0%,rgba(153,153,153,1) 25%,rgba(153,153,153,1) 75%,rgba(153,153,153,0) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00999999', endColorstr='#00999999',GradientType=1 );
}
.headingLarge {
    font-size: 42px;
    line-height: 1.35;
    color: #666666;
    text-align: center;
}

.headingMedium {
    font-size: 24px;
    line-height: 1.69;
    color: #666666;
    text-align: center;
}
@media print, screen and (max-width: 640px) {

.headingBorderLeft {
    font-size: 4.5vw;
    padding-left: 3%;
}
.headingBorderBottom {
    font-size: 4.5vw;
    padding-bottom: 5%;
}

.headingBorderTopBottom {
    font-size: 3.75vw;
    padding: 3% 0;
}
.headingLarge {
    font-size: 7vw;
}

.headingMedium {
    font-size: 3.3vw;
}
}
/*--------------------
- text
--------------------*/
.text + .text{
    margin-top: 30px;
}
.textNormal {
    font-size: 16px;
    color: #666666;
    line-height: 2;
}

.textTall {
    font-size: 16px;
    color: #666666;
    line-height: 2.63;
}
.section_body_item a:link, .section_body_item a:visited {
    color: #3a81d8;
    text-decoration: underline;
}
@media print, screen and (max-width: 640px) {
    .text + .text{
        margin-top: 7%;
    }
    .textNormal {
        font-size: 3.5vw;
    }
    
    .textTall {
        font-size: 3.25vw;
    }
}
/*--------------------
- panel
--------------------*/
.panelWrap{
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -moz-justify-content: space-between;
  -ms-justify-content: space-between;
  -o-justify-content: space-between;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
      justify-content: space-between;
          -ms-flex-wrap: wrap;
          flex-wrap: wrap;
}

.imgCaptionPanel{
    width: 32%;
}
.imgCaptionPanel_head{
    margin-bottom: 14px;
}
.imgCaptionPanel_info{
    font-size: 16px;
}
.imgCaptionPanel_name{
    margin-bottom: 14px;
}
.imgCaptionPanel_name span{
    font-size: 0.875em;
}

.textImgPanel{
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -moz-justify-content: space-between;
  -ms-justify-content: space-between;
  -o-justify-content: space-between;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
      justify-content: space-between;
          -ms-flex-wrap: wrap;
          flex-wrap: wrap;
}
.textImgPanel + .textImgPanel{
    margin-top: 80px;
}
.textImgPanel-flipped{
    -webkit-box-orient : horizontal;
    -webkit-box-direction : reverse;
        -ms-flex-direction : row-reverse;
            flex-direction : row-reverse;
}
.textImgPanel_main{
    width: 55%;
}
.textImgPanel_sub{
    width: 40%;
}

.textImgFloatPanel_spacer{
    float: right;
}
.textImgFloatPanel_spacer-small{
    height: 150px;
}
.textImgFloatPanel_spacer-large{
    height: 220px;
}
.textImgFloatPanel_sub{
    float: right;
    max-width: 335px;
    clear: both;
    margin-left: 40px;
}
@media print, screen and (max-width: 900px) {
    .textImgFloatPanel{
        display: -moz-flex;
        display: -ms-flex;
        display: -o-flex;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: reverse;
           -ms-flex-direction: column-reverse;
               flex-direction: column-reverse;
          }
          .textImgFloatPanel_spacer{
              float: none;
              display: none;
          }
          .textImgFloatPanel_sub{
              float: none;
              max-width: 100%;
              margin-left: 0;
              margin-top: 7%;
          }
}
@media print, screen and (max-width: 768px) {
    .imgCaptionPanel_info {
        font-size: 100%;
    }
}
@media print, screen and (max-width: 640px) {
    .imgCaptionPanel{
        width: 100%;
        margin-bottom: 7%;
    }
    .imgCaptionPanel:last-child{
        margin-bottom: 0;
    }
    .imgCaptionPanel_head{
        margin-bottom: 3%;
    }
    .imgCaptionPanel_info {
        font-size: 3.5vw;
    }
    .imgCaptionPanel_name{
        margin-bottom: 3%;
    }
    .textImgPanel + .textImgPanel{
        margin-top: 10%;
    }
    .textImgPanel-flipped{
        -webkit-box-orient:horizontal;
        -webkit-box-direction:normal;
            -ms-flex-direction:row;
                flex-direction:row;
    }
    .textImgPanel_main{
        width: 100%;
        margin-bottom: 7%;
    }
    .textImgPanel_sub{
        width: 100%;
    }
    .textImgFloatPanel{
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: reverse;
     -ms-flex-direction: column-reverse;
         flex-direction: column-reverse;
    }
    .textImgFloatPanel_spacer{
        float: none;
        display: none;
    }
    .textImgFloatPanel_sub{
        float: none;
        max-width: 100%;
        margin-left: 0;
        margin-top: 7%;
    }
}
/*--------------------
- mainvisual
--------------------*/
.mainvisual img{
width: 100%;
vertical-align: bottom;
}
/*--------------------
- lead
--------------------*/
.lead{
    margin-bottom: 85px;
}
.lead_head{
    padding: 35px 0 100px;
    background-image: url(../images/bg_lead_top.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}
.lead_head_top{
    margin-bottom: 28px;
}
.lead_head_middle{
    width: 480px;
    margin: 0 auto 16px;
}
.lead_body{
    margin-bottom: 50px;
}
@media print, screen and (min-width: 1366px) {
    .lead_head{
        padding: 3vw 0 9vw;
    }
}
@media print, screen and (max-width: 640px) {
    .lead{
        margin-bottom: 10%;
    }
    .lead_head{
        padding: 5% 0 22%;
    }
    .lead_head_top{
        margin-bottom: 5%;
    }
    .lead_head_middle{
        width: 90%;
        margin: 0 auto 5%;
    }
    .lead_body{
        margin-bottom: 5%;
    }
}
/*--------------------
- utility
--------------------*/

.u-visible-xs,
.u-visible-sm,
.u-visible-md {
    display: none;
}

.u-visible-lg {
    display: inherit;
}

@media only screen and (max-width: 1500px) {
    .u-visible-xs,
    .u-visible-sm,
    .u-visible-lg {
        display: none;
    }
    .u-visible-md {
        display: inherit;
    }
}

@media only screen and (max-width: 1000px) {
    .u-visible-lg,
    .u-visible-md,
    .u-visible-xs {
        display: none;
    }
    .u-visible-sm {
        display: inherit;
    }
}

@media only screen and (max-width: 750px) {
    .u-visible-lg,
    .u-visible-md,
    .u-visible-sm {
        display: none;
    }
    .u-visible-xs {
        display: inherit;
    }
}


.u-mt-lv1 {
    margin-top: 20px !important;
}

.u-mt-lv2 {
    margin-top: 40px !important;
}

.u-mt-lv3 {
    margin-top: 60px !important;
}

.u-mt-lv4 {
    margin-top: 120px !important;
}

.u-mb-lv1 {
    margin-bottom: 20px !important;
}

.u-mb-lv2 {
    margin-bottom: 40px !important;
}

.u-mb-lv3 {
    margin-bottom: 60px !important;
}

.u-mb-lv4 {
    margin-bottom: 120px !important;
}

@media print, screen and (max-width: 640px) {
    .u-mt-lv1 {
        margin-top: 5% !important;
    }
    
    .u-mt-lv2 {
        margin-top: 10% !important;
    }
    
    .u-mt-lv3 {
        margin-top: 15% !important;
    }
    
    .u-mt-lv4 {
        margin-top: 20% !important;
    }
    
    .u-mb-lv1 {
        margin-bottom: 5% !important;
    }
    
    .u-mb-lv2 {
        margin-bottom: 10% !important;
    }
    
    .u-mb-lv3 {
        margin-bottom: 15% !important;
    }
    
    .u-mb-lv4 {
        margin-bottom: 20% !important;
    }
}