@charset "utf-8";

/* ++++++++++++++++++++++++++++++++++++++++++++++++ */
/*    サイト共通 細かい要素の装飾定義               */
/* ++++++++++++++++++++++++++++++++++++++++++++++++ */



/* ++++++++++++++++++++++++++++++++++++++++++++++++ */
/*   code                                           */
/* ++++++++++++++++++++++++++++++++++++++++++++++++ */
code{
  display: block;
  padding: 50px;
  margin: 50px auto;
  width: 87.5%;
  color: #66a;
  background: #fff;
  font-size: 0.875rem!important;
}


/* ++++++++++++++++++++++++++++++++++++++++++++++++ */
/*   images                                         */
/* ++++++++++++++++++++++++++++++++++++++++++++++++ */
img{
  max-width: 100%;
}
    /* googlemap 内の画像は適用外 */
    #GoogleMap img{
      max-width: none;
    }

/* 画像表示 汎用（試作物）version 2017013001
--------------------------------------------------- */

    /* デフォルト */
    .Image{
    }
    p.Image{
      text-align: center;
    }
    .Image a{
      display: block;
    }
    .Image img{
      width: 100%;
      height: auto;
    }
    /* キャプションのバリエーション */
    .CaptionText{
    }
    /* デフォルトサイズ */
    .Image.Default img{
      width: auto;
    }
    /* 表示枠を埋める */
    .Image.Cover{
      overflow: hidden;
    }
    .Image.Cover img{
      min-width:  100%;
      min-height: 100%;
      width:      auto;
      height:     auto;
      max-width:  none;
      max-height: none;
    }
    /* 全体を見せる （画像が表示枠より小さい場合は枠よりも小さくなる） */
    .Image.Contain{
      text-align: center;
      vertical-align: middle;
    }
    .Image.Contain img{
      min-width:  0;
      min-height: 0;
      width:      auto;
      height:     auto;
      max-width:  100%;
      max-height: 100%;
    }
    /* フィット */
    .Image.Fit{
    
    }
    .Image.Fit img{
      width:      100%;
      height:     100%;
    }
    
    
    


/* ++++++++++++++++++++++++++++++++++++++++++++++++ */
/*   Text and Heading                               */
/* ++++++++++++++++++++++++++++++++++++++++++++++++ */


/* 見出し common
--------------------------------------------------- */
.Heading{
  line-height: 1.5;
  margin: 2em 0;
}
.Heading:first-child,
.Heading[class*="Type"]:first-child{
  margin-top: 0;
}

/* 見出しバリエーション
--------------------------------------------------- */

/* Type1 :::::::::::::::::::::::::  */
.Heading.Type1{
  font-weight: 400;
  position: relative;
  padding: 1em 0 2em;
}
.Heading.Type1 > .Main{
  font-size: 200%;
  vertical-align: middle;
  letter-spacing: 0.25em;
  display: block;
  text-align: center;
}
.Heading.Type1 > .Sub{
  margin: 0.5em 0;
  letter-spacing: 0.1em;
  display: block;
  text-align: center;
  opacity: 0.75;
}
.Heading.Type1::after{
  content: "";
  display: block;
  width: 15%;
  height: 2px;
  margin: 0;
  position: absolute;
  left: 42.5%;
  bottom: 0px;
  background: #444a59;
   
}

/* Type2 :::::::::::::::::::::::::  */
.Heading.Type2{
  position: relative;
  font-size: 125%;
  margin: 2em 0 0.75em;
}
.Heading.Type2::after{
  position: absolute;
  bottom: -1px;
  left: 0;
  z-index: 2;
  content: '';
  width: 100%;
  height: 1px;
  background-color: rgba(68,74,89,0.3);
}
.Heading.Type2 > .Main{
  letter-spacing: 0.125em;
  position: relative;
  display: inline-block;
  padding-bottom: .5em;
  font-weight: 400;
  padding-left:  0.25em;
  padding-right: 0.125em;
  text-align: center;
  min-width: 7.5em;
}
.Heading.Type2 > .Main::before{
  content: "";
  width: 3px;
  height: 100%;
  position: absolute;
  left: -15px;
  display: block;
  border-radius: 3px;
  background:  #36a;
}
.Heading.Type2 > .Main::after{
  position: absolute;
  bottom: -1px;
  left: 0;
  z-index: 2;
  content: '';
  width: 100%;
  height: 1px;
  background-color: rgb(68,74,89);
}
.Heading.Type2 > .Sub{
  font-weight: normal;
  font-size: 75%;
  letter-spacing: 0.25em;
  margin-left: 1.5em;
}

.Heading.Type2 > .Sub::before,
.Heading.Type2 > .Sub::after{
  content: "─";
  color: rgba(0,0,0,0.75);
}



/* Type3 :::::::::::::::::::::::::  */
.Heading.Type3 {
  
}
.Heading.Type3 > .Main{
  font-size: 137.5%;
  font-weight: 400;
  vertical-align: middle;
  letter-spacing: 0.125em;
  display: block;
  text-align: center;
}
.Heading.Type3 > .Sub{
  font-size: 75%;
  font-weight: 400;
  margin: 0 0 0.5em;
  letter-spacing: 0.1em;
  display: block;
  text-align: center;
  opacity: 0.75;
  text-align: center;
}



/* Type4 :::::::::::::::::::::::::  */
.Heading.Type4{
  margin: 2em 0 0.75em;
  background: #dfe5f1;
  background: rgba(128,150,200,0.25);
}
.Heading.Type4 > .Main{
  font-size: 112.5%;
  display: inline-block;
  min-width: 15em;
  letter-spacing: 0.2em;
  font-weight: 400;
  padding: 0.75em 1.5em;
  color: #fff;
  background-color: #369;
  background-image: -webkit-repeating-linear-gradient(-45deg, rgba(0,0,0,0.1), rgba(0,0,0,0.1) 3px, rgba(0,0,0,0.15) 3px, rgba(0,0,0,0.15) 6px);
  background-image:         repeating-linear-gradient(-45deg, rgba(0,0,0,0.1), rgba(0,0,0,0.1) 3px, rgba(0,0,0,0.15) 3px, rgba(0,0,0,0.15) 6px);
  background-size: 60px 60px;
  text-align: center;
}
.Heading.Type4 > .Sub{
  padding: 0 1em;
  font-weight: 400;
}



/* Type5 :::::::::::::::::::::::::  */
.Heading.Type5 {
  margin: 2em 0 0.75em;
  background: #ddd;
}
.Heading.Type5 > .Main{
  display: inline-block;
  min-width: 15em;
  letter-spacing: 0.2em;
  font-weight: 400;
  padding: 0.5em 1em;
  color: #fff;
  background-color: #36a;
  text-align: center;
}
.Heading.Type5 > .Sub{
  padding: 0 1em;
  font-weight: 400;
}



/* Type6 :::::::::::::::::::::::::  */
.Heading.Type6 {
  margin: 2em 0 0.75em;
  background: rgba(0,0,0,0.05);
  padding: 0 1em;
  letter-spacing: 0.2em;
}
.Heading.Type6 > .Main{
  display: inline-block;
  font-weight: 400;
  padding: 0.5em 0;
  padding-right: 0.5em;
  padding-right: ;
}
.Heading.Type6 > .Main::before{
  content: "●";
  color: #36a;
}
.Heading.Type6 > .Sub{
  padding: 0;
  font-size: smaller;
  font-weight: 400;
  letter-spacing: 0.1em;
}










/* SiteLogo
--------------------------------------------------- */
.SiteLogo {
  margin: 0;
}
.SiteLogo,
.SiteLogo *{
  vertical-align: middle;
}
.SiteLogo .Icon{
  margin-right: 0.5em;
}
.SiteLogo .Icon img{
  width:  2.5em;
  height: 2.5em;
  margin: 0;
}
.SiteLogo .Label{
  color: #262d3d;
}
.SiteLogo .Label img{
  height: 1em;
  width: 15.833em;
}



/* PageTitle
--------------------------------------------------- */
.PageTitle{
  /*
  color: #fff;
  background: rgba(10,120,80,1);
  background-image: linear-gradient( to left, rgba(10,120,80,0.75), rgba(10,120,80,0.75) ), url(../img/common/decoration/forest.jpg);
  background-size: cover;
  background: none;
  */
  color: #222;
}
.PageTitle .Heading{
  margin:  0;
  padding: 0;
  height:    3.25em;
  font-size: 200%;
  position: relative;
}
.PageTitle .Heading > .Main{
  padding: 0em;
  display: inline-block;
  letter-spacing: 0.125em;
  font-weight: normal;
  position: absolute;
  left: 0%;
  top:  0%;
  width: 100%;
  line-height: 5em;
}
.PageTitle .Heading > .Sub{
  font-size: 75%;
  position: absolute;
  right:  0em;
  top: 70%;
  margin-top: -.5em;
  line-height: 1;
  font-weight: 300;
  letter-spacing: 0.125em;
}





/* DefaultText
--------------------------------------------------- */
.DefaultText{
  line-height: 1.75;
}
p.DefaultText{
  margin: 0 0 1.75em;
}
p.DefaultText:last-child{
  margin-bottom: 0;
}

        /* リスト系 */
        ul.DefaultText,
        ol.DefaultText{
          line-height: 1.5;
          margin: 1em 0 1.75em 1.5em;
        }
        ul.DefaultText:first-child,
        ol.DefaultText:first-child{
          margin-top: 0;
        }
        ul.DefaultText:last-child,
        ol.DefaultText:last-child{
          margin-bottom: 0;
        }
        ul.DefaultText li,
        ol.DefaultText li{
          margin: 0 0 0.75em;
        }
        ul.DefaultText li:last-child,
        ol.DefaultText li:last-child{
          margin-bottom: 0;
        }
            /* リストスタイル */
            ul.ListStyleKatakana,
            ol.ListStyleKatakana{
              list-style-type: katakana;
            }
            /* ネスト */
            ul.DefaultText ul,
            ul.DefaultText ol,
            ol.DefaultText ul,
            ol.DefaultText ol{
              font-size: smaller;
              margin-top:  0.5em;
              margin-left: 4em;
            }
                ul.DefaultText ul li,
                ul.DefaultText ol li,
                ol.DefaultText ul li,
                ol.DefaultText ol li{
                  margin: 0 0 0.25em;
                }
        
        
        dl.DefaultText{
          line-height: 1.5;
          margin: 1.5em 0;
        }
        dl.DefaultText dt{
          font-weight: bold;
          margin-bottom: 0.25em;
        }
        dl.DefaultText dd{
          margin-left: 3em;
          margin-bottom: 1.5em;
          line-height: 1.5;
        }
        
        ul:not([class]),
        ol:not([class]),
        dl:not([class]){
          margin: 1em 0 1em 1.5em;
        }


        /* 強調 */
        .DefaultText em{
          background: #def;
          padding: 0 0.25em;
        }

        
        


/* AttentionText
--------------------------------------------------- */
.AttentionText{
  font-size: 87.5%;
}

/* CaptionText
--------------------------------------------------- */
.CaptionText{
  display: block;
  font-size: 75%;
  line-height: 1.5;
  display: block;
  margin: 1em 0;
  text-align: center;
}


/* tel link
--------------------------------------------------- */
.TelLink{
}
.TelLink:hover{
}


/* sup
--------------------------------------------------- */
sup{
  font-size: x-small;
  line-height: 1.1;
}


/* 丸付き文字
--------------------------------------------------- */
.Circled{
  color: #fff;
  background: #aba0d5;
  border-radius: 1.5em;
  display: inline-block;
  width: 1.5em;
  line-height: 1.5em;
  text-align: center;
  vertical-align: middle;
}


/* 補助スタイル （ボーダー）
--------------------------------------------------- */
.BorderTop{
  margin-top:  0.75em;
  border-top:  1px solid rgba(0,0,0,0.5);
  padding-top: 0.75em;
}


/* tooltip
--------------------------------------------------- */
.Tooltip {
  border-bottom: 1px dashed;
  cursor: pointer;
  margin: 0 0.25em;
  color: #2098d1;
}
.Tooltip::before{
  margin-right: 0.25em;
}
.Tooltip:hover {
  border-bottom: none;
}
    .ui-tooltip {
      box-shadow: none;
      color: #2098d1;
      background: white;
      border: 2px solid;
      width: 20em;
      max-width: 50%;
      padding: 20px;
      z-index: 100;
      text-align: left;
    }
    .ui-tooltip * {
    }



/* font
--------------------------------------------------- */

/* basic */
.FontSansSerif{
  /*font-family: "Verdana", "Hiragino Kaku Gothic ProN", "Meiryo", "Arial", "Century Gothic", sans-serif;*/
  font-family:  "Meiryo", "Hiragino Kaku Gothic ProN", "Arial", "Century Gothic", sans-serif;
}
.FontSerif{
  font-family: "Times New Roman", "Hiragino Mincho ProN", "HiraMinProN-W3", "MS PMincho", serif;
}
.FontMonospace{
  font-family: "Osaka-mono", "MS Gothic", monospace;
}
.FontNumber{
  font-family: "Arial";
}
/* webfont */
.FontJapanese{
  font-family: "Mplus 1p", "Hiragino Kaku Gothic ProN", "Meiryo", sans-serif;
   -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
           font-smooth:    always;
      -webkit-transform: rotate(0.05deg);
              transform: rotate(0.05deg);
}
        /* 見出しのラインが斜めになるのを補正 */
        .Heading.FontJapanese::before,
        .Heading.FontJapanese::after,
        .Heading.FontJapanese > .Main::before,
        .Heading.FontJapanese > .Main::after,
        .Heading.FontJapanese > .Sub::before,
        .Heading.FontJapanese > .Sub::after {
      -webkit-transform: rotate(-0.05deg);
              transform: rotate(-0.05deg);
        }
        
.FontEnglish {
  font-family: "Arial", "Century Gothic", sans-serif;
}



/* FontSize
--------------------------------------------------- */
.FontSizeXLarge,
.DefaultText.FontSizeXLarge{
  font-size: 200%;
}
.FontSizeLarge,
.DefaultText.FontSizeLarge{
  font-size: 150%;
}
.FontSizeLarger,
.DefaultText.FontSizeLarger{
  font-size: 125%;
}
.FontSizeNormal,
.DefaultText.FontSizeNormal{
  font-size: 100%;
}
.FontSizeSmaller,
.DefaultText.FontSizeSmaller{
  font-size: 87.5%;
}
.FontSizeSmall,
.DefaultText.FontSizeSmall{
  font-size: 75%;
}
.FontSizeXSmall,
.DefaultText.FontSizeXSmall{
  font-size: 62.5%;
}
/* FontWeight
--------------------------------------------------- */
.FontWeightNormal{
  font-weight: normal;
}
.FontWeightBold{
  font-weight: bold;
}

/* TextAlign
--------------------------------------------------- */
.TextAlignCenter{
  text-align: center;
}
.TextAlignLeft{
  text-align: left;
}
.TextAlignRight{
  text-align: right;
}
.TextAlignJustify{
  text-align: justify;
}

/* VerticalAlign
--------------------------------------------------- */
.VerticalAlignTop,
.VerticalAlignTop *{
  vertical-align: top;
}
.VerticalAlignMiddle,
.VerticalAlignMiddle *{
  vertical-align: middle;
}
.VerticalAlignBottom,
.VerticalAlignBottom *{
  vertical-align: bottom;
}


/* Padding
--------------------------------------------------- */
.PadingBottom{
  padding-bottom: 1em;
}
.PaddingTop{
  padding-top:    1em;
}
.PaddingHorizontal{
  padding-left:   1em;
  padding-right:  1em;
}
.PaddingHorizontal{
  padding-left:   1em;
  padding-right:  1em;
}



/* TextOverFlowNone
--------------------------------------------------- */
.TextOverFlowNone{
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
/* NoWrap
--------------------------------------------------- */
.NoWrap{
  white-space: nowrap;
}



/* ++++++++++++++++++++++++++++++++++++++++++++++++ */
/*   DropDown                                       */
/* ++++++++++++++++++++++++++++++++++++++++++++++++ */

/* ドロップダウン
--------------------------------------------------- */
.DropDownParent{
  position: relative;
}
    .DropDownChild{
      display: none;
      position: absolute;
      top:   100%;
      left:    0%;
      width: 100%;
      z-index: 50;
      border: 1px solid rgba(20,80,180,1);
      background: #fff;
    }
/* ドロップダウン（多階層リスト専用）
--------------------------------------------------- */
.DropDownListParent{
}
    .DropDownListParent ul{
      list-style: none;
    }
    .DropDownListParent ul a {
      display: block;
    }
    .DropDownListParent ul li{
    }
    /* リストの配置 */
    .DropDownListParent li ul{
      display: none;
    }
    .DropDownListParent li ul li{
      display: block;
    }
    .DropDownListParent .ul-level-2{
      top:   100%;
      left:    0%;
      z-index: 50;
      position: absolute;
    }
    .DropDownListParent .ul-level-3{
      top:     0%;
      left:  100%;
      z-index: 100;
      position: absolute;
    }
    
    /* - - level-1 - - */
    .DropDownListParent .li-level-1{
      display: inline-block;
      position: relative;
    }
    .DropDownListParent  .a-level-1 .Label{
      display: inline-block;
    }
    /* - - level-2 - - */
    .DropDownListParent .ul-level-2 {
      font-size: 87.5%;
      padding: 0 5px;
      background: #999;
    }
    .DropDownListParent .li-level-2 {
      position: relative;
      margin: 5px 0;
    }
    .DropDownListParent .ul-level-2,
    .DropDownListParent .li-level-2,
    .DropDownListParent  .a-level-2 {
      width: 100%;
    }
    .DropDownListParent .ul-level-2,
    .DropDownListParent .ul-level-2 * {
      line-height: 2;
    }
    .DropDownListParent .a-level-2 {
      background: rgb(200,225,255);
      background-image: linear-gradient( to bottom, rgba(255,255,255,0), rgba(255,255,255,0.5) );
      background: #fff;
      border-radius: 0.25em;
      padding: 0.5em 10px;
    }
    .DropDownListParent .a-level-2 .Icon,
    .DropDownListParent .a-level-2 .Icon *{
      line-height: 1;
    }
    /* - - level-3 - - */
    .DropDownListParent .ul-level-3 {
      width: 40em;
      font-size: 87.5%;
      padding: 10px;
      background: #666;
    }
    .DropDownListParent .li-level-3{
      float: left;
      width: 50%;
    }
    .DropDownListParent .a-level-3 {
      background: rgb(180,200,240);
      background: #eee;
      /*background-image: linear-gradient( to bottom, rgba(255,255,255,0), rgba(255,255,255,0.5) );*/
      padding: 0.375em 10px;
      border-radius: 0.25em;
      margin: 2px;
    }
    .DropDownListParent .ul-level-3.narrow {
      width: 20em;
    }
    .DropDownListParent .ul-level-3.narrow .li-level-3 {
      width: 100%;
    }

            /* hover, Active */
            .DropDownListParent .ul-level-1 a:hover,
            .DropDownListParent .ul-level-1 .Active > a{
                  color: #fff;
                  background: #444a59;
            }

/* ++++++++++++++++++++++++++++++++++++++++++++++++ */
/*   CategoryMenuBox                                */
/*   カテゴリ内 メニュー                            */
/* ++++++++++++++++++++++++++++++++++++++++++++++++ */

/* CategoryMenuBox
--------------------------------------------------- */
.CategoryMenuBox{
  
}
    /* ボタンのスタイルを上書き */
    .CategoryMenuBox .SknTplTextButton  .Button{
      padding: 0.75em 1.5em;
    }
    .CategoryMenuBox .SknTplTextButton  .Button .Label{
      min-width: 7.5em;
    }

    /* AdditionalMenuBox （追加メニュー）
    --------------------------------------------------- */
    .CategoryMenuBox.Additional{
      margin:  0.5em 0 0;
      padding: 0.25em 1em;
      display: inline-block;
    }
        /* ボタンのスタイルを上書き */
        .CategoryMenuBox.Additional .SknTplTextButton  .Button{
        }
        .CategoryMenuBox.Additional .SknTplTextButton  .Button .Label{
        }





/* ++++++++++++++++++++++++++++++++++++++++++++++++ */
/*   MessageBox                                     */
/* ++++++++++++++++++++++++++++++++++++++++++++++++ */

/* MessageBox
--------------------------------------------------- */
.MessageBox{
  padding: 0px 0 50px;
  margin: 1em auto;
  width: 75%;
  text-align: center;
  background: rgba(255,255,255,0.5);
  border: 4px solid #ddd;
  border-radius: 10px;
  position: relative;
}
    .MessageBox .Heading{
      font-size: 125%;
      margin: 0 0 1em;
    }
    .MessageBox .Heading .Icon::before{
      font-size: 400%;
    }
    .MessageBox .DefaultText{
      text-align: center;
      line-height: 1.3;
      margin: 0;
    }
    /* options */
    .MessageBox.Caution{
      color: #222;
      color: inherit;
      background: #f5f47a;
    }
    .MessageBox.Clear .Heading{
      color: #4584ed;
    }
    .MessageBox.Error .Heading{
      color: #dc4e1f;
    }

/* ++++++++++++++++++++++++++++++++++++++++++++++++ */
/*   SearchBox                                      */
/* ++++++++++++++++++++++++++++++++++++++++++++++++ */

/* 検索ボックス
--------------------------------------------------- */
.SearchBox{
  margin: 0 1em;
}
    .SearchBox .InputText,
    .SearchBox  button,
    .SearchBox .Button{
      font-size: 1rem;
      line-height: 2rem;
      border: none;
      padding: 0 0.75em;
      border-radius: 0.2em;
    }
    .SearchBox .InputText{
      font-size: smaller;
      color: rgba(0,0,0,0.5);
      background: #eeeded;
      margin-right: 0.5em;
      width: 15em;
      height: 2rem;
    }
    .SearchBox button,
    .SearchBox .Button{
      font-size: smaller;
      cursor: pointer;
      color: #fff;
      background: #1677cb;
        -webkit-appearance: none; /* safari: 独自CSSを外す */
    }
    /* hover */
    .SearchBox  button:hover,
    .SearchBox .Button:hover{
      background: #2687db;
    }
    
    /* - - フリーワード用 - - */
    .SearchBox.FreeWordSearchBox{
    
    }
    
    /* - - カテゴリ用 - - */
    .SearchBox.CategorySearchBox{
    
    }
    .SearchBox .CategoryList {
      list-style: none;
      
    }



/* 検索ボックス(GoogleSearchBox)
--------------------------------------------------- */
.GoogleSearchBox{
  font-size: 87.5%;
}
    .GoogleSearchBox .InputText{
      background: rgb(245,245,245) url("http://www.google.com/cse/static/images/1x/googlelogo_lightgrey_46x16dp.png") no-repeat  left center;
      text-indent: 48px;
    }



/* ++++++++++++++++++++++++++++++++++++++++++++++++ */
/*   Form Setting [Common]                          */
/* ++++++++++++++++++++++++++++++++++++++++++++++++ */

/* FormTable
--------------------------------------------------- */
.FormTable{
  /* Tableの箇所で定義 */
}


/* FormItem
--------------------------------------------------- */
.FormItem{
  margin: 0.25em 0;
}
    /* placeholder  */
    .FormItem ::-webkit-input-placeholder,
    .FormItem ::-moz-placeholder,
    .FormItem :-ms-input-placeholder {
      color: #ccc;
      color: rgba(0,0,0,0.25);
      font-weight: normal!important;
      font-size: 75%;
    }
    .FormItem ::-moz-placeholder {
      opacity: 1;
    }
    
    
    /* ReadOnly */
    .FormItem .ReadOnly{
      font-weight: bold!important;
      background: rgba(0,50,255,0.05)!important;
      color: #000!important;
    }
    /* Whole form */
    .FormItem input,
    .FormItem select,
    .FormItem textarea{
      border: 1px solid #ccc;
      border-radius: 0.5em;
      font-size: 100%;
      padding: 0.5em 1em;
      vertical-align: middle;
    }
    .FormItem select{
      padding: 1em 2.5em;
      position: relative;
    }
    .FormItem select::after{
    }
    .FormItem textarea{
      width: 100%;
      height: 15em;
    }
    .FormItem .RadioButtonGroup label,
    .FormItem .CheckBoxGroup label{
      line-height: 1;
      cursor:pointer;
      margin-right: 1em;
      white-space: nowrap;
      vertical-align: middle;
      float: left;
    }
    .FormItem .RadioButton,
    .FormItem .CheckBox{
      border: none;
      margin-right: 4px;
    }
    
    /* Generic forms part */
    .FormItem .InputText{
      width: 100%;
      max-width: 20em;
    }
    .FormItem .InputName1,
    .FormItem .InputName2{
      width: 40%;
    }
    .FormItem .InputZip{
      width: 30%;
    }
    .FormItem .InputPhone{
      width: 50%;
    }
    .FormItem .InputAddress{
      width: 100%;
    }
    .FormItem .InputMail{
      width: 100%;
    }

    /* fieldset , jquery-ui override */
    fieldset{
      margin: 0;
      border: none;
    }
    
    /* 項目ごとのエラー文 */
    .FormTable .Caution{
      border-radius: 0.5em;
      font-size: 75%;
      color: #fff;
      background: #f00;
      padding: 0.5em;
      margin: 0.25em;
      
    }







/* ++++++++++++++++++++++++++++++++++++++++++++++++ */
/*   GoPageTop                                      */
/* ++++++++++++++++++++++++++++++++++++++++++++++++ */

/* GoPageTop
--------------------------------------------------- */
.GoPageTop{
}

/* ++++++++++++++++++++++++++++++++++++++++++++++++ */
/*   Button 等                                      */
/* ++++++++++++++++++++++++++++++++++++++++++++++++ */

/* menu-trigger (ハンバーガーメニュー)
--------------------------------------------------- */
.MenuTrigger{
}

/* BreadCrumb（パンくず）
--------------------------------------------------- */
.BreadCrumb {
  margin: 0.75em auto 0;
  padding: 0;
  font-size: 75%;
  line-height: 3em;
  z-index: 10;
  /*position: relative;*/
  position: absolute;
  width: 100%;
  
}
    .BreadCrumb p{
      border-bottom: 1px solid rgba(128,128,128,0.25);
    }
    .BreadCrumb p *{
    }
    .BreadCrumb p .Partition{
      opacity: 0.5;
      padding: 0 0.25em;
      display: inline;
    }
    /* Unit */
    .BreadCrumb p .Unit{
      text-align: left;
    }
    .BreadCrumb p a{
      color: rgb(20,80,180);
    }
    .BreadCrumb p a:hover{
      text-decoration: underline;
    }
    .BreadCrumb p .Unit.Last{
      font-weight: bold;
      color: #fff;
    }






/* ++++++++++++++++++++++++++++++++++++++++++++++++ */
/*   effect                                         */
/* ++++++++++++++++++++++++++++++++++++++++++++++++ */


/* ブラー効果
--------------------------------------------------- */

    /* brightness */
    .Blur{
      -webkit-filter: blur(3px);
              filter: blur(3px);
    }

/* 背景効果
--------------------------------------------------- */

    /* 背景固定 */
    .fix-bg{
      background-attachment: fixed!important;
    }
    /* スクロールで視差効果 */
    .parallax-bg{
      background-position: 50% -150px;
    }



/* 各種hover効果
--------------------------------------------------- */


    /* hoverエフェクト共通 */
    [class^="hvr-"],
    [class*=" hvr-"] {
      -webkit-transition: all .2s;
              transition: all .2s;
    }
    
    /* default */
    .hvr-default{
    }
        .hvr-default:hover{
          background: #222;
          color: #fff;
        }

    /* brightness */
    .hvr-brightness-up{
    }
        .hvr-brightness-up:hover{
          -webkit-filter: brightness(1.1);
                  filter: brightness(1.1);
        }
        .hvr-brightness-down{
        }
        .hvr-brightness-down:hover{
          -webkit-filter: brightness(0.9);
                  filter: brightness(0.9);
        }
    
    /* outline */
    .hvr-outline{
      outline: 0px solid #f00;
      -webkit-transition: all .1s;
              transition: all .1s;
    }
        .hvr-outline:hover{
          outline: 5px solid #f00;
          z-index: 15;
        }
    
    
    /* zoom */
    .hvr-zoom{
      z-index: 10;
      display: inline-block;
    }
        .hvr-zoom:hover{
          position: relative;
          z-index: 15;
          -webkit-transform: scale(1.25);
                  transform: scale(1.25);
        }
    /* zoom を 子要素.Image内のimgに適用する */
    .hvr-childimg-zoom .Image{
      overflow: hidden;
      display: inline-block;
    }
        .hvr-childimg-zoom      .Image img{
          -webkit-transition: all .5s;
                  transition: all .5s;
          -webkit-transform: scale(1);
                  transform: scale(1);
          opacity: 1;
        }
        .hvr-childimg-zoom:hover .Image img{
          -webkit-transform: scale(1.125);
                  transform: scale(1.125);
          opacity: 1;
        }

    /* 画像へのリンクなら「＋」を表示 */
    a[href*=".jpg"],
    a[href*=".png"],
    a[href*=".gif"]{
      position: relative;
    }
    a[href*=".jpg"]::before,
    a[href*=".png"]::before,
    a[href*=".gif"]::before{
      content: "＋";
      font-size: 150%;
      line-height: 1.5em;
      width: 1.5em;
      background: #0e3382;
      color: #fff;
      position: absolute;
      text-align: center;
      vertical-align: middle;
      z-index: 50;
      display: inline-block;
      bottom: 5px;
      right:  -5px;
      opacity: 0;
    }
    a[href*=".jpg"]:hover::before,
    a[href*=".png"]:hover::before,
    a[href*=".gif"]:hover::before{
      opacity: 1;
      right:  5px;
    }

/* ++++++++++++++++++++++++++++++++++++++++++++++++ */
/*   link                                           */
/* ++++++++++++++++++++++++++++++++++++++++++++++++ */

/* anchor（全体）
--------------------------------------------------- */
a{
  text-decoration: none;
  color: inherit;
      -webkit-transition: all .1s;
              transition: all .1s;
}
a:link {
}
a:visited {
}
a:active{
}
a:hover {
}

/* anchor（特定の要素内）
--------------------------------------------------- */
table.Meta    a,
.DefaultText  a,
.DefaultTable a,
.ParagraphContents a{
  color: rgb(20,120,200);
  text-decoration: underline;
}
table.Meta    a:hover,
.DefaultText  a:hover,
.DefaultTable a:hover{
}



/* image link
--------------------------------------------------- */
a img{
}
a[href]:hover img{
  opacity: 0.75;
}
a[href*=".jpg"]{
  position: relative;
}


/* ReadMore
--------------------------------------------------- */
p.ReadMore {
  margin: 1em 0;
  text-align: center;
}
p.ReadMore  .Label,
a.ReadMore  .Label,
a .ReadMore .Label {
  color: rgba(20,120,200,1);
  display: inline-block;
  padding-bottom: 0.25em;
  line-height: 1.25;
  position: relative;
}
p.ReadMore  .Label::after,
a.ReadMore  .Label::after,
a .ReadMore .Label::after {
  content: "";
  display: block;
  position: absolute;
  left: 0px;
  bottom: 0px;
  height: 1px;
  width: 100%;
  background: rgba(20,120,200,1);
      -webkit-transition: all .2s;
              transition: all .2s;
}

    /* hover */
    p.ReadMore a:hover *,
    a.ReadMore:hover   *,
    a:hover  .ReadMore * {
      color: inherit;
    }
    p.ReadMore a:hover .Label::after,
    a.ReadMore:hover   .Label::after,
    a:hover  .ReadMore .Label::after {
      width: 120%;
      left: -10%;
    }


/* ++++++++++++++++++++++++++++++++++++++++++++++++ */
/*   アイコン 等                                    */
/* ++++++++++++++++++++++++++++++++++++++++++++++++ */

/* アイコンに下線が付くのを回避 */
.Icon,
.Icon::before{
  text-decoration: none!important;
}


/* icon position left  */
.icon-pos-left{
  position: absolute;
  left: 0.5em;
  right: auto;
  top: 50%;
  margin: 0;
  margin-top: -0.5em;
}
[class^="icon-"].icon-pos-left:before,
[class*=" icon-"].icon-pos-left:before {
  margin: 0;
}
/* icon position right  */
.icon-pos-right{
  position: absolute;
  left: auto;
  right: 0.5em;
  top: 50%;
  margin: 0;
  margin-top: -0.5em;
}
[class^="icon-"].icon-pos-right:before,
[class*=" icon-"].icon-pos-right:before {
  margin: 0;
}


/* icon position bottom */
.icon-pos-bottom{
  position: absolute;
  left:  50%;
  bottom: -0.5em;
  margin: 0;
  margin-left: -0.5em;
}
[class^="icon-"].icon-pos-bottom:before,
[class*=" icon-"].icon-pos-bottom:before {
}


/* icon position top */
.icon-pos-top{
  padding-top: 3em;
  display: block;
}
.icon-pos-top.FontSizeXLarge{
  font-size: 300%;
  padding-bottom: 0.125em;
  margin-bottom:  0.25em;
  border-bottom: 1px solid rgba(125,125,125,0.5);
}
[class^="icon-"].icon-pos-top:before,
[class*=" icon-"].icon-pos-top:before {
  display: block;
  text-align: center;
  margin: 0 auto 0.25em;
}

/* 特殊なアイコン用のスタイル */
.icon-file-pdf::before,
.icon-file-excel::before,
.icon-file-word::before,
.icon-file-image::before,
.icon-file-archive::before{
  width: 1em;
  line-height: 1em;
}

.icon-file-pdf::before {
  color:      #bb0708!important;
}
.icon-file-excel::before {
  color:      #12824b!important;
}
.icon-file-word::before {
  color:      #3b67a7!important;
}
.icon-file-image::before {
  color:      #fff!important;
}
.icon-file-archive::before {
  color:      #30b4df!important;
}




/* ボタンのバリエーション（ベースはtemlpate）
--------------------------------------------------- */

    /* 青 */
    .SknTplTextButton .Button.Blue {
      color: #fff;
      background: rgb(20,120,255);
    }
    無効.SknTplTextButton .Button.Blue[href]:hover {
      color: #fff;
      background: rgb(50,140,255);
    }
    /* 赤 */
    .SknTplTextButton .Button.Red {
      color: #fff;
      background: rgb(255,0,0);
    }
    無効.SknTplTextButton .Button.Red[href]:hover {
      background: rgb(255,50,50);
    }
    /* 白 */
    .SknTplTextButton .Button.White {
      color: #262626;
      background: rgba(255,255,255,1);
    }
    無効.SknTplTextButton .Button.White[href]:hover {
      background: rgba(245,245,255,1);
    }
    /* 黒 */
    .SknTplTextButton .Button.Black {
      color: #fff;
      background: rgba(20,20,20,1);
    }
    無効.SknTplTextButton .Button.Black[href]:hover {
      background: rgba(45,45,45,1);
    }



    /* ボーダー */
    .SknTplTextButton .Button.Border {
      border: 1px solid;
    }



    /* 無効 */
    .SknTplTextButton .Button.Invalid,
    .SknTplTextButton .Button.Invalid:hover {
      opacity: 0.375;
    }

/* 特殊メニュー
--------------------------------------------------- */

    /* MenuList.ContactMenu */
    .MenuList.ContactMenu{
      list-style: none;
      text-align: center;
    }
    .MenuList.ContactMenu li{
      display: inline-block;
      margin: 0 1em;
    }
    
    .MenuList.ContactMenu .Icon{
    }
    .MenuList.ContactMenu .Icon::before{
      margin: 0;
      color: #444a59;
      background-color: #f0f0f0;
      width: 1.5em;
      text-align: center;
      line-height: 1.5;
      font-size: 125%;
      border-radius: 100%;
    }
    .MenuList.ContactMenu .Label{
    }
    .MenuList.ContactMenu .Label .Main{
      font-size: 137.5%;
      font-weight: 500;
    }
    .MenuList.ContactMenu .Label .Sub{
      margin-right: 0.5em;
      font-size: 100%;
    }
            /* hover */
            .MenuList.ContactMenu .DropDownParent:hover .Icon::before,
            .MenuList.ContactMenu               a:hover .Icon::before{
              color: #fff;
              background: rgba(20,80,180,1);
            }

/* ++++++++++++++++++++++++++++++++++++++++++++++++ */
/*   TabMenu Setting                                */
/* ++++++++++++++++++++++++++++++++++++++++++++++++ */


/* TabMenu （共通）
--------------------------------------------------- */

    /* - - list - - */
    .TabMenu ul{
      list-style: none;
      margin: 0 auto;
      width: 75%;
    }
    .TabMenu ul > li{
      display: block;
      float: left;
      /* width: 20%;  幅はcolumnで指定 */
    }
    .TabMenu ul > li a{
      display: block;
      background: #fff;
      text-align: center;
      position: relative;
      margin: 0 5px;
    }
    .TabMenu ul > li .Label{
      padding: 0.75em 0;
    }
    .TabMenu ul > li .Label .Main{
      display: block;
      font-size: 100%;
      line-height: 1.5;
      letter-spacing: 0.05em;
      font-weight: 400;
    }
    .TabMenu ul > li .Label .Sub{
      display: block;
      font-size: 62.5%;
      line-height: 1.5;
      color: rgba(128,128,128,0.75);
      letter-spacing: 0.125em
    }
    /* hover */
    .TabMenu ul > li a::after{
      content: "";
      display: block;
      left:   0px;
      bottom: 0px;
      width: 100%;
      height: 1px;
      background: #1450b4;
      position: absolute;
          -webkit-transition: height .2s;
                  transition: height .2s;
    }
    .TabMenu ul > li:not(.Active) a:hover{
      cursor: pointer;
    }
    .TabMenu ul > li:not(.Active) a:hover::after{
      height: 6px;
    }


    /* Active */
    .TabMenu ul > li.Active{
    }
    .TabMenu ul > li.Active a{
      color: #fff;
      background: #1450b4;
    }



/* TabMenu （Type1:装飾付き）
--------------------------------------------------- */
.TabMenu.Type1{
  padding: 30px;
  background: rgba(90,85,85,0.75);
}




/* TabMenu （Type2:装飾シンプル）
--------------------------------------------------- */
.TabMenu.Type2{
}


/* ++++++++++++++++++++++++++++++++++++++++++++++++ */
/*    Pagenation                                    */
/* ++++++++++++++++++++++++++++++++++++++++++++++++ */

/* Pagenation
--------------------------------------------------- */
.Pagenation {
  margin: 1em 0;
}
    .Pagenation ul{
      font-size: 87.5%;
      font-family: "Arial";
      font-weight: bold;
      line-height: 3;
      text-align: center;
    }
        .Pagenation ul li{
          display: inline-block;
          margin: 0 2px;
          text-align: center;
        }
            .Pagenation ul li a{
              display: block;
              border: none;
              float: none;
              margin:  0;
              padding: 0;
              width: 3em;
              color: #204c97;
              border: 1px solid;
              border-radius: 0.25em;
              overflow: hidden;
              position: relative;
              text-align: center;
              background: #fff;
            }
            .Pagenation ul li a{
              text-decoration: none;
              cursor: pointer;
            }
            .Pagenation ul li a:hover{
              background: rgba(20,120,255,0.125);
            }
            .Pagenation ul li.Active a,
            .Pagenation ul li.Active a:hover{
              color: #fff;
              background: #204c97;
              border-color: #204c97;
            }
            .Pagenation ul li.Invalid a,
            .Pagenation ul li.Invalid a:hover{
              color: #204c97;
              background: none;
              opacity: 0.25;
              
            }
            .Pagenation ul li.Invalid  .Icon::before,
            .Pagenation ul li.Invalid a{
              -webkit-animation-name: none!important;
                      animation-name: none!important;
              cursor: default;
            }
    /* adjust icon */
    .Pagenation li .Icon::before{
      display: inline;
      margin: 0;
    }
    .Pagenation li .Icon + .Label{
      display: none;
    }


/* ++++++++++++++++++++++++++++++++++++++++++++++++ */
/*   Table Setting                                  */
/* ++++++++++++++++++++++++++++++++++++++++++++++++ */

/* DefaultTable
--------------------------------------------------- */
.DefaultTable{
  margin: 1em auto;
  width: 100%;
  text-align: left;
  border-collapse: collapse;
  background: #fff;
}
    .DefaultTable caption{
      padding: .25em 0;
    }
    .DefaultTable th,
    .DefaultTable td{
      padding: 0.75em 15px;
      border: 1px solid #ddd;
      font-weight: normal;
      line-height: 1.5;
    }
    /* thead */
    .DefaultTable thead{
      font-size: smaller;
    }
    .DefaultTable thead th{
      text-align: center;
      font-weight: normal;
      background: #eef;
      border: 1px solid #ccc;
      padding: 0.5em 0;
    }
    /* tbody */
    .DefaultTable tbody{
    }
    .DefaultTable tbody th{
      color: #555;
      background: #f9f9f9;
      background: rgba(30,60,120,0.05);
      text-align: center;
      width: 25%;
    }
    .DefaultTable tbody td{
    
    }
    /* tfoot */
    .DefaultTable tfoot{
    }





/* ++++++++++++++++++++++++++++++++++++++++++++++++ */
/*   Column Setting                                 */
/* ++++++++++++++++++++++++++++++++++++++++++++++++ */

/* ColumnGroup
--------------------------------------------------- */
.ColumnGroup{

}
    /* - - column common - -  */
    .ColumnGroup > .Column{
      width: 100%;
      margin: 0 auto 2em;
    }
    .ColumnGroup > .Column > .inner{
      padding: 10px;
    }
    
    /* 要素数をクラス名に持たせて自動配置 ※ulにクラス名をつけて使用  */
    /* ColumnGroup（数字）elements が横並び数                         */
    /* FixedNumber をつけた場合は数を固定。それ以外は幅に応じて変化   */
    
    /* - - two columns - - */
    body                             .ColumnGroup4elements >             .Column:nth-child(1n),
    body                             .ColumnGroup3elements >             .Column:nth-child(1n),
    body.rsbp-over-bp3               .ColumnGroup2elements >             .Column:nth-child(1n),
    body:not([class*="rsbp"])        .ColumnGroup2elements >             .Column:nth-child(1n),
    body[class*="rsbp"]              .ColumnGroup2elements.FixedNumber > .Column:nth-child(1n) {
      width: 50%;
      float: left;
      margin-bottom: 0;
    }
    
    
    /* - - three columns - - */
    body                             .ColumnGroup6elements >             .Column:nth-child(1n),
    body                             .ColumnGroup5elements >             .Column:nth-child(1n),
    body.rsbp-over-bp3               .ColumnGroup4elements >             .Column:nth-child(1n),
    body.rsbp-over-bp3               .ColumnGroup3elements >             .Column:nth-child(1n),
    body:not([class*="rsbp"])        .ColumnGroup3elements >             .Column:nth-child(1n),
    body[class*="rsbp"]              .ColumnGroup3elements.FixedNumber > .Column:nth-child(1n) {
      width: 33.33%;
      float: left;
      margin-bottom: 0;
    }

    /* - - four columns - - */
    body.rsbp-over-bp3               .ColumnGroup6elements >             .Column:nth-child(1n),
    body.rsbp-over-bp3               .ColumnGroup5elements >             .Column:nth-child(1n),
    body.rsbp-over-bp2               .ColumnGroup4elements >             .Column:nth-child(1n),
    body:not([class*="rsbp"])        .ColumnGroup4elements >             .Column:nth-child(1n),
    body[class*="rsbp"]              .ColumnGroup4elements.FixedNumber > .Column:nth-child(1n) {
      width: 25%;
      float: left;
      margin-bottom: 0;
    }
    
    /* - - five columns - - */
    body.rsbp-over-bp2               .ColumnGroup6elements >             .Column:nth-child(1n),
    body.rsbp-over-bp2               .ColumnGroup5elements >             .Column:nth-child(1n),
    body:not([class*="rsbp"])        .ColumnGroup5elements >             .Column:nth-child(1n),
    body[class*="rsbp"]              .ColumnGroup5elements.FixedNumber > .Column:nth-child(1n) {
      width: 20%;
      float: left;
      margin-bottom: 0;
    }
    
    /* - - six columns - - */
    body.rsbp-over-bp1               .ColumnGroup6elements >             .Column:nth-child(1n),
    body:not([class*="rsbp"])        .ColumnGroup6elements >             .Column:nth-child(1n),
    body[class*="rsbp"]              .ColumnGroup6elements.FixedNumber > .Column:nth-child(1n) {
      width: 16.6%;
      float: left;
      margin-bottom: 0;
    }







/* ++++++++++++++++++++++++++++++++++++++++++++++++ */
/*   Other Setting                                  */
/* ++++++++++++++++++++++++++++++++++++++++++++++++ */

/* Scrollable 横スクロール
--------------------------------------------------- */
.Scrollable {
  overflow: auto;
  position: relative;
}
    .Scrollable > table {
      width: 660px; /* ここはスクロール対象の最大幅を入れる */
      margin-bottom: 0!important;
    }
    .Scrollable th{
      white-space: nowrap;
    }
    .Scrollable::-webkit-scrollbar{
      height: 1em;
      margin-top: 5px;
    }
    .Scrollable::-webkit-scrollbar-track{
      background: rgba(0,0,0,0.25);
    }
    .Scrollable::-webkit-scrollbar-thumb {
      background: #03c;
    }