@charset "utf-8";



/* ++++++++++++++++++++++++++++++++++++++++++++++++ */
/*    Template                                      */
/* ++++++++++++++++++++++++++++++++++++++++++++++++ */


/* SknTpl common ：共通の定義
--------------------------------------------------- */
/*
.SknTpl{
  margin: 1.25em auto;
}

.Heading + .SknTpl{
}
div > .SknTpl:first-child{
  margin-top: 0;
}
div > .SknTpl:last-child{
  margin-bottom: 0;
}
*/








/* ImageParagraph Template ：画像（大）、画像（左右）とテキスト
--------------------------------------------------- */
.SknTplImageParagraph{
}
    /* TextItem */
    .SknTplImageParagraph .TextItem{
      width: 60%;
    }
            /* 画像おおきめ */
            .SknTplImageParagraph.LargeImage .TextItem{
              width: 45%;
            }
            /* 画像floatなし */
            .SknTplImageParagraph.FloatNone  .TextItem{
              float: none;
              width: auto;
            }
    /* ImageItem */
    .SknTplImageParagraph .ImageItem{
      width: 35%;
      position: relative;
    }
            /* 画像おおきめ */
            .SknTplImageParagraph.LargeImage .ImageItem{
              width: 50%;
            }
            /* 画像floatなし */
            .SknTplImageParagraph.FloatNone  .ImageItem{
              margin: 1em 0;
            }
    .SknTplImageParagraph .ImageItem .Image{
      margin: 0;
      display: block;
      text-align: center;
    }
    .SknTplImageParagraph .ImageItem .Image img{
      width: 100%;
    }
    .SknTplImageParagraph .ImageItem .Image.Default img{
      width: auto;
    }
            /* ボーダー付き */
            .SknTplImageParagraph .ImageItem.Border{
              border: 1px solid;
            }



    /* - - FullImage - - */
    .SknTplImageParagraph.FullImage{
    }
    .SknTplImageParagraph.FullImage .ImageItem{
      width: auto;
    }
    .SknTplImageParagraph.FullImage .TextItem{
      width: auto;
      margin-top: 0.75em;
    }



    /* - - LeftImage - - */
    .SknTplImageParagraph.LeftImage .ImageItem{
      float: left;
      margin-right: 10px;
    }
    .SknTplImageParagraph.LeftImage .TextItem{
      float: right;
    }
    /* - - RightImage - - */
    .SknTplImageParagraph.RightImage .ImageItem{
      float: right;
      margin-left: 10px;
    }
    .SknTplImageParagraph.RightImage .TextItem{
      float: left;
    }
        /* + + + + + レスポンシブ + + + + +  */
        html.rsbp-under-bp2 .SknTplImageParagraph.RightImage .ImageItem,
        html.rsbp-under-bp2  .SknTplImageParagraph.LeftImage .ImageItem{
          float: none;
          width: auto;
          margin: 0 0 1em;
          padding: 0;
          text-align: center;
        }
        html.rsbp-under-bp2 .SknTplImageParagraph.RightImage .ImageItem .Image,
        html.rsbp-under-bp2  .SknTplImageParagraph.LeftImage .ImageItem .Image{
          margin: 0 auto;
        }
        html.rsbp-under-bp2 .SknTplImageParagraph.RightImage .TextItem,
        html.rsbp-under-bp2  .SknTplImageParagraph.LeftImage .TextItem{
          float: none;
          width: auto;
        }
        
        /* + + + + + /レスポンシブ + + + + +  */










/* DecoratedBox Template ：装飾付きボックス
--------------------------------------------------- */
.SknTplDecoratedBox.Type1 {
}
.SknTplDecoratedBox.Type1 > .DecoratedBox{
  background: #f3f5f6;
  margin:  25px 0;
  padding: 15px;
}
.SknTplDecoratedBox.Type1:first-child > .DecoratedBox{
  margin-top: 0;
}
    .SknTplDecoratedBox.Type1 > .DecoratedBox > .inner{
      background: #fff;
      padding: 30px 40px;
    }
    .SknTplDecoratedBox.Type1 > .DecoratedBox > .inner > .Heading:first-child{
      margin-top: 0;
    }
    .SknTplDecoratedBox.Type1 > .DecoratedBox > .inner > .Heading.Type1{
      margin-left: calc( -40px - 20px );
    }
        /* + + + + + レスポンシブ + + + + +  */
        
            /* bp2より狭いディスプレイ用 */
            html.rsbp-under-bp2 .SknTplDecoratedBox.Type1 > .DecoratedBox{
              margin:  10px -10px;
              padding: 5px;
            }
            html.rsbp-under-bp2 .SknTplDecoratedBox.Type1 > .DecoratedBox  > .inner{
              padding: 15px;
            }
            html.rsbp-under-bp2 .SknTplDecoratedBox.Type1 > .DecoratedBox  > .inner > .Heading.Type1{
              margin-left: calc( -15px - 5px );
            }










/* DecoratedBox Template ：装飾付きボックス
--------------------------------------------------- */
.SknTplDecoratedBox.Type2 {
}
.SknTplDecoratedBox.Type2 > .DecoratedBox{
  margin:  10px 0;
  padding: 0;
}
.SknTplDecoratedBox.Type2:first-child > .DecoratedBox{
  margin-top: 0;
}
    .SknTplDecoratedBox.Type2 > .DecoratedBox > .inner{
      background: #faeddc;
      background: #f0ecdc;
      padding: 25px;
    }
    .SknTplDecoratedBox.Type2 > .DecoratedBox > .inner > .Heading:first-child{
      margin-top: 0;
    }
    .SknTplDecoratedBox.Type2 > .DecoratedBox > .inner > .Heading.Type1{
      margin-left: calc( -25px - 20px );
    }
        /* + + + + + レスポンシブ + + + + +  */
        
            /* bp2より狭いディスプレイ用 */
            html.rsbp-under-bp2 .SknTplDecoratedBox.Type2 > .DecoratedBox{
              margin:  10px -10px;
              padding: 5px;
            }
            html.rsbp-under-bp2 .SknTplDecoratedBox.Type2 > .DecoratedBox  > .inner{
              padding: 15px;
            }
            html.rsbp-under-bp2 .SknTplDecoratedBox.Type2 > .DecoratedBox  > .inner > .Heading.Type1{
              margin-left: calc( -15px - 5px );
            }












/* SknTplThumbnailList ：画像付きリスト
--------------------------------------------------- */
.SknTplThumbnailList{
}
    .SknTplThumbnailList ul{
      list-style: none;
    }
    
    /* Type1 左にサムネタイプ - - - - - - - - - - - - - -  */
    .SknTplThumbnailList .ThumbnailList.Type1{
    }

        .SknTplThumbnailList .ThumbnailList.Type1 > li {
          padding: 0;
          line-height: 1;
          vertical-align: middle;
        }
        .SknTplThumbnailList .ThumbnailList.Type1 > li *{
          vertical-align: middle;
        }
        .SknTplThumbnailList .ThumbnailList.Type1 > li a{
          display: block;
          position: relative;
          padding: 20px;
        }

        /* Thumbnail style */
        .SknTplThumbnailList .ThumbnailList.Type1 .ImageItem{
          width: 100px;
          overflow: hidden;
          vertical-align: middle;
          float: left;
        }
            .SknTplThumbnailList .ThumbnailList.Type1 .ImageItem .Image{
              height: 100px;
            }
            .SknTplThumbnailList .ThumbnailList.Type1 .ImageItem .Image .Landscape{
              height: 100%;
              width:  auto;
            }
            .SknTplThumbnailList .ThumbnailList.Type1 .ImageItem .Image .Portrait{
              height: auto;
              width:  100%;
            }

        /* text style */
        .SknTplThumbnailList .ThumbnailList.Type1 .TextItem{
          margin-left: 125px;
        }
            .SknTplThumbnailList .ThumbnailList.Type1 .TextItem .Title{
              font-weight: 400;
              font-size: 125%;
              margin: 0 0 1em;
            }
            .SknTplThumbnailList .ThumbnailList.Type1 .TextItem .DefaultText{
              font-size: 87.5%;
            }




    /* Type2 上にサムネタイプ type - - - - - - - - - - - - - -  */
    .SknTplThumbnailList .ThumbnailList.Type2{
    }
        .SknTplThumbnailList .ThumbnailList.Type2 > li{
          padding: 0;
          line-height: 1;
          vertical-align: middle;
        }
        .SknTplThumbnailList .ThumbnailList.Type2 > li > .inner{
          display: block;
        }
        .SknTplThumbnailList .ThumbnailList.Type2 > li a{
          position: relative;
          display: block;
        }
            /* tableを利用して縦横中央揃え */
            .SknTplThumbnailList .ThumbnailList.Type2 > li .ImageItem{
              /*display: table;*/
              width: 100%;
            }
            .SknTplThumbnailList .ThumbnailList.Type2 > li .ImageItem > p{
              /*display: table-cell;*/
              width: 100%;
              vertical-align: middle;
              text-align: center;
            }
            .SknTplThumbnailList .ThumbnailList.Type2 > li .ImageItem .Image{
            }

        /* Thumbnail style */
        .SknTplThumbnailList .ThumbnailList.Type2 .ImageItem{
          vertical-align: middle;
        }
            .SknTplThumbnailList .ThumbnailList.Type2 .ImageItem p.Image{
            }
            .SknTplThumbnailList .ThumbnailList.Type2 .ImageItem p.Caption{
              font-size: 87.5%;
              line-height: 1.5;
              margin-top: 0.5em;
            }


        /* text style */
        .SknTplThumbnailList .ThumbnailList.Type2 .TextItem{
          padding: 1.5em 0;
        }
            .SknTplThumbnailList .ThumbnailList.Type2 .TextItem .Title{
              text-align: center;
              line-height: 1.5;
              margin-bottom: 0.5em;
              font-size: 112.5%;
            }
            .SknTplThumbnailList .ThumbnailList.Type2 .TextItem .Title .Sub{
              font-size: 75%;
              white-space: nowrap;
            }
            .SknTplThumbnailList .ThumbnailList.Type2 .TextItem .PriceText{
              font-size: 87.5%;
              line-height: 1.5;
              padding-bottom: .5em;
              border-bottom: 1px solid rgba(0,0,0,0.2);
              margin-bottom: .5em;
              
            }
            .SknTplThumbnailList .ThumbnailList.Type2 .TextItem .DefaultText{
              font-size: 87.5%;
              opacity: 0.75;
              line-height: 1.75;
              margin-bottom: 0;
              text-align: left;
            }


                /* + + + + + レスポンシブ + + + + +  */
                
                    /* bp2より広いディスプレイ用 */
                    html.rsbp-over-bp2 .SknTplThumbnailList .ThumbnailList.Type2 > li > .inner{
                      padding: 20px;
                    }
                    /* bp2より狭いディスプレイ用 */
                    html.rsbp-under-bp2 .SknTplThumbnailList .ThumbnailList.Type2 > li > .inner{
                      padding: 10px;
                    }
                    




    /* Type3 上にサムネの 密集型バナータイプ  - - - - - - - - - - - - - -  */
    .SknTplThumbnailList .ThumbnailList.Type3{
    }
        .SknTplThumbnailList .ThumbnailList.Type3 > li{
          padding: 0;
          line-height: 1;
          vertical-align: middle;
        }
        .SknTplThumbnailList .ThumbnailList.Type3 > li > .inner{
          display: block;
          padding: 0px;
        }
        .SknTplThumbnailList .ThumbnailList.Type3 > li a{
          position: relative;
          display: block;
          -webkit-transition: bottom .2s;
                  transition: bottom .2s;
          background: #fff;
          padding: 4px;
          outline: 1px solid #74fffd;
          bottom: 0;
          z-index: 2;
        }
        .SknTplThumbnailList .ThumbnailList.Type3 > li a:hover{
          outline: 1px solid #328cff;
          bottom: 5px;
          z-index: 5;
        }
        /* Thumbnail style */
        .SknTplThumbnailList .ThumbnailList.Type3 > li .ImageItem{
          width: 100%;
        }
        .SknTplThumbnailList .ThumbnailList.Type3 > li .ImageItem .Image{
        }


        /* text style */
        .SknTplThumbnailList .ThumbnailList.Type3 .TextItem{
          padding: 1.5em 0;
        }
             /* 画像がある場合 */
            .SknTplThumbnailList .ThumbnailList.Type3 .ImageItem + .TextItem{
              padding-top: 3em;
              position: absolute;
              left: 0px;
              bottom: 0px;
              width: 100%;
              background-image: linear-gradient( to bottom, rgba(255,255,255,0) 0%, rgba(255,255,255,0.875) 25%, rgba(255,255,255,1) 50%, rgba(255,255,255,1) 100% );
            }
       
            .SknTplThumbnailList .ThumbnailList.Type3 .TextItem .Title{
              text-align: center;
              margin: 0;
              color: #000;
            }
            .SknTplThumbnailList .ThumbnailList.Type3 .TextItem .Title .Main,
            .SknTplThumbnailList .ThumbnailList.Type3 .TextItem .Title .Sub{
              display: block;
            }
            .SknTplThumbnailList .ThumbnailList.Type3 .TextItem .Title .Main{
              font-size: 150%;
            }
            .SknTplThumbnailList .ThumbnailList.Type3 .TextItem .Title .Sub{
              font-size: 62.5%;
              letter-spacing: 0.05em;
            }
            .SknTplThumbnailList .ThumbnailList.Type3 .TextItem .DefaultText{
              font-size: 87.5%;
              opacity: 0.75;
              line-height: 1.5;
            }




    /* フロー（矢印アイコン付） バージョン - - - - - - - - - - - - - -  */
    .SknTplThumbnailList .ThumbnailList.FlowList            li{
      position: relative;
      margin: 0;
    }
    .SknTplThumbnailList .ThumbnailList.FlowList            li > .inner{
      padding: 1.5em;
    }
    .SknTplThumbnailList .ThumbnailList.FlowList            li .Icon{
      font-size: 150%;
    }
    .SknTplThumbnailList .ThumbnailList.FlowList.Vertical   li .Icon{
      
    }
    .SknTplThumbnailList .ThumbnailList.FlowList.Horizontal li .Icon{
      right: -.5em;
    }






/* TextButton Template ：テキストボタン
--------------------------------------------------- */
.SknTplTextButton{
  position: relative;
}

    /* - - ul - - */
    .SknTplTextButton ul{
      list-style: none;
      text-align: center;
      margin: 1em 0!important;
      letter-spacing: -0.5em;
    }
    .SknTplTextButton li{
      margin: 2.5px;
      display: inline-block;
      letter-spacing: 0;
    }
    /* - - p - - */
    .SknTplTextButton p{
      font-size: 100%;
      text-align: center;
      margin: 0;
    }
    /* - - Button style - - */
    .SknTplTextButton .Button {
      /* ボタンのスタイルは common_elementをつかう */
    }











/* DecoratedTable Template ：表組み（テーブル）
--------------------------------------------------- */
.SknTplDecoratedTable{
}
    .SknTplDecoratedTable table{
      width: 100%;
      border-collapse: collapse;
      margin: 0 auto;
    }
    /* common */
    .SknTplDecoratedTable tr{
    }
    .SknTplDecoratedTable th,
    .SknTplDecoratedTable td{
      padding: 1em 1em;
      padding: 0.375em 0.5em;
      border:  1px solid rgba(120,100,90,0.25);
    }
    
    .SknTplDecoratedTable th{
      text-align: center;
      font-weight: 500;
    }
    .SknTplDecoratedTable td{
      background: #fff;
    }
    
    /* thead */
    .SknTplDecoratedTable thead{
    
    }
    .SknTplDecoratedTable thead th{
      line-height: 1.125;
      padding: 0.5em 0px;
      border: 1px solid;
      letter-spacing: 0.05em;
      text-align: center;
      overflow: hidden;
      white-space: nowrap;
      font-size: smaller;
      color: #fff;
      background: #435f9a;
      background: #49d;
    }
    .SknTplDecoratedTable thead th:first-child{
    }
    /* tbody */
    .SknTplDecoratedTable tbody{
    }
    .SknTplDecoratedTable tbody th{
      background: rgba(120,100,90,0.125);
    }
    .SknTplDecoratedTable tbody > tr > th:not([width]){
      width: 20%;
    }
    .SknTplDecoratedTable tbody td{
    }
    .SknTplDecoratedTable tbody td .Heading{
      margin-left: 0px;
      margin-right: 0px;
    }
            /* + + + + + レスポンシブ + + + + +  */
            html.rsbp-under-bp2 .SknTplDecoratedTable{
            }
            /* notScrollable */
            html.rsbp-under-bp2 .SknTplDecoratedTable{
            }
            html.rsbp-under-bp2 .SknTplDecoratedTable > :not([class*="Scrollable"]) thead th{
              display: none;
            }
            html.rsbp-under-bp2 .SknTplDecoratedTable > :not([class*="Scrollable"]) thead th:first-child:last-child{
              display: block;
            }
            html.rsbp-under-bp2 .SknTplDecoratedTable > :not([class*="Scrollable"]) tr,
            html.rsbp-under-bp2 .SknTplDecoratedTable > :not([class*="Scrollable"]) th,
            html.rsbp-under-bp2 .SknTplDecoratedTable > :not([class*="Scrollable"]) td{
              display: block;
              width: auto!important;
            }
            html.rsbp-under-bp2 .SknTplDecoratedTable > :not([class*="Scrollable"]) tr{
              margin-bottom: 4px;
            }
            html.rsbp-under-bp2 .SknTplDecoratedTable > :not([class*="Scrollable"]) th{
              padding: 0.5em 10px;
              width: auto;
            }
            html.rsbp-under-bp2 .SknTplDecoratedTable > :not([class*="Scrollable"]) td{
              border-top: none;
            }
            html.rsbp-under-bp2 .SknTplDecoratedTable > :not([class*="Scrollable"]) tbody td + td{
            }
            html.rsbp-under-bp2 .SknTplDecoratedTable .NoDecoratedTable td{
              border: none!important;
            }
            
            /* Scrollable */
            html.rsbp-under-bp2 .Scrollable .SknTplDecoratedTable thead{
              display: table-header-group;
            }
            html.rsbp-under-bp2 .Scrollable .SknTplDecoratedTable thead th{
              display: table-cell;
            }
            html.rsbp-under-bp2 .Scrollable .SknTplDecoratedTable tr{
              display: table-row;
            }
            html.rsbp-under-bp2 .Scrollable .SknTplDecoratedTable th,
            html.rsbp-under-bp2 .Scrollable .SknTplDecoratedTable td{
              display: table-cell;
            }
    
    
    /* - - inner list - - */
    .SknTplDecoratedTable ul,
    .SknTplDecoratedTable ol{
      margin: 0 0 0 2em;
    }
    .SknTplDecoratedTable li ul ,
    .SknTplDecoratedTable li ol{
      margin: 0.25em 0 0.5em 1em;
    }












/* TextList Template ：テキストリスト
--------------------------------------------------- */
.SknTplTextList{
}
    /* - - ul - - */
    .SknTplTextList ul.TextList{
      list-style: none;
      margin: 0;
    }
    .SknTplTextList ul.TextList > li{
      padding: 0.5em 0;
      margin: 0;
      border-bottom: 1px dotted rgba(0,0,0,0.25);
    }
    .SknTplTextList ul.TextList > li:first-child{
      border-top: 1px dotted rgba(0,0,0,0.25);
    }
    .SknTplTextList ul.TextList > li > a{
      margin: 0;
      padding: 0.75em 0.5em 0.75em 2.75em;
      display: block;
      text-decoration: none;
      position: relative;
      border-radius: 0.25em;
    }
    .SknTplTextList ul.TextList > li .Label{
      
    }
    .SknTplTextList ul.TextList > li .Label span.Sub{
      display: block;
      font-size: 75%;
      line-height: 1;
      opacity: 0.75;
    }
    
    .SknTplTextList ul.TextList > li .Icon{
      vertical-align: middle;
      position: absolute;
      top: 50%;
      left: 0%;
      margin-top: -0.75em;
      padding: 0 0.25em;
      margin-top: -1em;
      padding: 0;
    }
    .SknTplTextList ul.TextList > li .Icon::before{
      color: #fff;
      background: #328cff;
      line-height: 2;
      width: 2em;
      border-radius: 100%;
    }
    /* hover */
    .SknTplTextList ul.TextList > li > a{
      background: rgba(50,140,255,0.05);
    }
    .SknTplTextList ul.TextList > li > a:hover{
      background: #444a59;
      background: rgba(50,140,255,0.15);
    }
    .SknTplTextList ul.TextList > li > a:hover *{
    }








/* SknTplFaq ：Ｑ＆Ａ
--------------------------------------------------- */
.SknTplFaq {
}
    .SknTplFaq > .inner {
      border: 1px dashed rgba(10,210,230,0.5);
      background: #fff;
      border-radius: 1.5em;
      margin:  5px;
      padding: 30px;
    }
    /* common */
    .SknTplFaq > .inner > .QuestionText,
    .SknTplFaq > .inner > .AnswerText {
      position: relative;
      padding-left: 40px!important;
    }
    .SknTplFaq > .inner > .QuestionText::before,
    .SknTplFaq > .inner > .AnswerText::before {
      position: absolute;
      top: 0px;
      left: 0px;
      font-family: 'Century Gothic';
      font-weight: bold;
      color: #fff;
      width: 1.5em;
      line-height: 1.5em;
      text-align: center;
      vertical-align: middle;
    }
    
    
    
    /* question */
    .SknTplFaq > .inner > .QuestionText {
      font-weight: bold;
      font-size: 100%;
      color: #233e75;
    }
    .SknTplFaq > .inner > .QuestionText::before {
      content: "Q";
      background-color: #233e75;
    }
    /* answer */
    .SknTplFaq > .inner > .AnswerText {
      font-size: 100%;
      margin: 1em 0 0;
    }

    .SknTplFaq > .inner > .AnswerText a{
      color: #0078e1;
      text-decoration: underline;
    }
    .SknTplFaq > .inner > .AnswerText::before {
      content: "A";
      background-color: #cc2262;
      
    }
    
    .SknTplFaq.Accordion > .inner{
      -webkit-transition: background .2s;
              transition: background .2s;
    }
    .SknTplFaq.Accordion > .inner:hover{
      background: #def;
    }
    .SknTplFaq.Accordion.Active > .inner{
      background: #eef0ff;
    }
    









/* GetAdobeReader 
--------------------------------------------------- */
.SknTplGetAdobeReader{
  background: #eee;
  padding: 20px 30px;
  max-width: 500px;
}
    .SknTplGetAdobeReader .Banner{
      margin: 0;
      float: left;
      width: 125px;
    }
    .SknTplGetAdobeReader .Text{
      margin: 0 0 0 135px;
      font-size: 75%;
      line-height: 1.5;
      text-align: justify;
      color: #555;
    }
    /* + + + + + レスポンシブ + + + + +  */
    
        html.rsbp-under-bp2 .SknTplGetAdobeReader{
          padding: 10px;
        }
        html.rsbp-under-bp2 .SknTplGetAdobeReader .Banner{
          width: 75px;
        }
        html.rsbp-under-bp2 .SknTplGetAdobeReader .Banner img{
        }
        html.rsbp-under-bp2 .SknTplGetAdobeReader .Text{
          margin: 0;
          margin: 0 0 0 85px;
          font-size: 50%;
        }
        












/* SknTplColumnGroup
--------------------------------------------------- */
.SknTplColumnGroup {
}
    /* ColumnGroupはcommon_element.cssで定義 */










/* SknTplEmbedVideo
--------------------------------------------------- */
.SknTplEmbedVideo {
}
    .SknTplEmbedVideo > .inner{
      padding: 30px;
    }
    .SknTplEmbedVideo > .inner > .code {
      position: relative;
      width: 100%;
      padding-top: 56.25%;
    }
    .SknTplEmbedVideo > .inner > .code > iframe {
      position: absolute;
      top: 0;
      right: 0;
      width: 100% !important;
      height: 100% !important;
    }


/* SknTplEmbedGoogleMaps
--------------------------------------------------- */
.SknTplEmbedGoogleMaps {
}
    .SknTplEmbedGoogleMaps > .inner {
    }
    .SknTplEmbedGoogleMaps > .inner > .code {
      position: relative;
      width: 100%;
      padding-top: 56.25%;
    }
    .SknTplEmbedGoogleMaps > .inner > .code > iframe {
      position: absolute;
      top: 0;
      right: 0;
      width: 100% !important;
      height: 100% !important;
    }
