@charset "UTF-8";
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font: inherit;
  font-size: 100%;
  vertical-align: baseline;
}

html {
  line-height: 1;
}

ol, ul {
  list-style: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

caption, th, td {
  text-align: left;
  font-weight: normal;
  vertical-align: middle;
}

q, blockquote {
  quotes: none;
}
q:before, q:after, blockquote:before, blockquote:after {
  content: "";
  content: none;
}

a img {
  border: none;
}

article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary {
  display: block;
}

/*--------------------------------------
Base
----------------------------------------*/
body {
  font-size: 0.9em;
  line-height: 1.8em;
  color: #323232;
  font-family: "Hiragino Sans","メイリオ" , Meiryo ,"Helvetica Neue" , Helvetica , Arial , Verdana , Roboto , "ヒラギノ角ゴ Pro W3" , "Hiragino Kaku Gothic Pro" , "Meiryo UI" ,  "ＭＳ Ｐゴシック" , "MS PGothic" , sans-serif;
}

#navigation {
  font-family: "メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

#branch {
  font-family: "メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

p#branch {
  width: 980px;
  margin: 0 auto;
  font-size: 0.85em;
  padding-top: 7px;
}

p#branch a {
  color: #333;
  text-decoration: none;
}

p#branch a:hover,
p#branch a:focus {
  background-color: #195ebd;
  color: #fff;
}

a {
  text-decoration: none;
  cursor: pointer;
}

div {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.wrapper, .inner, .topHeader, .topHeader .logo, .bottomHeader > ul, .mainvisual, .mainvisual > .inner > .touroku > a, .mainvisual > .inner > .txtBox, .mainvisual > .inner > .txtBox__inner, .lead > .touroku > a, .conts01, .conts02, .conts02 .inner .hukidasi, .conts02 .hukidasiConts, .conts03__txt, .conts03 .inner .col2Box, .conts03 .inner .col2Box > .col--left .table, .conts03 .inner .col2Box > .col, .conts03 .inner .imgBox, .conts03 .inner .introductionList, .conts03 .inner .introductionList__inner, .conts03 .inner .introductionList__inner > li, .conts03 .inner .introductionList__inner > li > ul, .conts03 .inner .introductionList__inner > li.syo .syoBox, .conts03 .inner .introductionList__inner > li.syo .syoBox > ul, .conts03 .inner .after__inner, .conts04 > .col, .copy2 {
  *zoom: 1;
}
.wrapper:before, .inner:before, .topHeader:before, .topHeader .logo:before, .bottomHeader > ul:before, .mainvisual:before, .mainvisual > .inner > .touroku > a:before, .mainvisual > .inner > .txtBox:before, .mainvisual > .inner > .txtBox__inner:before, .lead > .touroku > a:before, .conts01:before, .conts02:before, .conts02 .inner .hukidasi:before, .conts02 .hukidasiConts:before, .conts03__txt:before, .conts03 .inner .col2Box:before, .conts03 .inner .col2Box > .col--left .table:before, .conts03 .inner .col2Box > .col:before, .conts03 .inner .imgBox:before, .conts03 .inner .introductionList:before, .conts03 .inner .introductionList__inner:before, .conts03 .inner .introductionList__inner > li:before, .conts03 .inner .introductionList__inner > li > ul:before, .conts03 .inner .introductionList__inner > li.syo .syoBox:before, .conts03 .inner .introductionList__inner > li.syo .syoBox > ul:before, .conts03 .inner .after__inner:before, .conts04 > .col:before, .copy2:before, .wrapper:after, .inner:after, .topHeader:after, .topHeader .logo:after, .bottomHeader > ul:after, .mainvisual:after, .mainvisual > .inner > .touroku > a:after, .mainvisual > .inner > .txtBox:after, .mainvisual > .inner > .txtBox__inner:after, .lead > .touroku > a:after, .conts01:after, .conts02:after, .conts02 .inner .hukidasi:after, .conts02 .hukidasiConts:after, .conts03__txt:after, .conts03 .inner .col2Box:after, .conts03 .inner .col2Box > .col--left .table:after, .conts03 .inner .col2Box > .col:after, .conts03 .inner .imgBox:after, .conts03 .inner .introductionList:after, .conts03 .inner .introductionList__inner:after, .conts03 .inner .introductionList__inner > li:after, .conts03 .inner .introductionList__inner > li > ul:after, .conts03 .inner .introductionList__inner > li.syo .syoBox:after, .conts03 .inner .introductionList__inner > li.syo .syoBox > ul:after, .conts03 .inner .after__inner:after, .conts04 > .col:after, .copy2:after {
  content: " ";
  display: table;
}
.wrapper:after, .inner:after, .topHeader:after, .topHeader .logo:after, .bottomHeader > ul:after, .mainvisual:after, .mainvisual > .inner > .touroku > a:after, .mainvisual > .inner > .txtBox:after, .mainvisual > .inner > .txtBox__inner:after, .lead > .touroku > a:after, .conts01:after, .conts02:after, .conts02 .inner .hukidasi:after, .conts02 .hukidasiConts:after, .conts03__txt:after, .conts03 .inner .col2Box:after, .conts03 .inner .col2Box > .col--left .table:after, .conts03 .inner .col2Box > .col:after, .conts03 .inner .imgBox:after, .conts03 .inner .introductionList:after, .conts03 .inner .introductionList__inner:after, .conts03 .inner .introductionList__inner > li:after, .conts03 .inner .introductionList__inner > li > ul:after, .conts03 .inner .introductionList__inner > li.syo .syoBox:after, .conts03 .inner .introductionList__inner > li.syo .syoBox > ul:after, .conts03 .inner .after__inner:after, .conts04 > .col:after, .copy2:after {
  clear: both;
}

.wrapper {
  margin: auto;
  font-family: "Hiragino Sans","メイリオ" , Meiryo ,"Helvetica Neue" , Helvetica , Arial , Verdana , Roboto , "ヒラギノ角ゴ Pro W3" , "Hiragino Kaku Gothic Pro" , "Meiryo UI" ,  "ＭＳ Ｐゴシック" , "MS PGothic" , sans-serif;
}

.mt90 {
  margin-top: 90px;
}

.mb90 {
  margin-bottom: 90px;
}

.mt85 {
  margin-top: 85px;
}

.mb85 {
  margin-bottom: 85px;
}

.mt80 {
  margin-top: 80px;
}

.mb80 {
  margin-bottom: 80px;
}

.mt75 {
  margin-top: 75px;
}

.mb75 {
  margin-bottom: 75px;
}

.mt70 {
  margin-top: 70px;
}

.mb70 {
  margin-bottom: 70px;
}

.mt65 {
  margin-top: 65px;
}

.mb65 {
  margin-bottom: 65px;
}

.mt60 {
  margin-top: 60px;
}

.mb60 {
  margin-bottom: 60px;
}

.mt55 {
  margin-top: 55px;
}

.mb55 {
  margin-bottom: 55px;
}

.mt50 {
  margin-top: 50px;
}

.mb50 {
  margin-bottom: 50px;
}

.mt45 {
  margin-top: 45px;
}

.mb45 {
  margin-bottom: 45px;
}

.mt40 {
  margin-top: 40px;
}

.mb40 {
  margin-bottom: 40px;
}

.mt35 {
  margin-top: 35px;
}

.mb35 {
  margin-bottom: 35px;
}

.mt30 {
  margin-top: 30px;
}

.mb30 {
  margin-bottom: 30px;
}

.mt25 {
  margin-top: 25px;
}

.mb25 {
  margin-bottom: 25px;
}

.mt20 {
  margin-top: 20px;
}

.mb20 {
  margin-bottom: 20px;
}

.mt15 {
  margin-top: 15px;
}

.mb15 {
  margin-bottom: 15px;
}

.mt10 {
  margin-top: 10px;
}

.mb10 {
  margin-bottom: 10px;
}

.mt5 {
  margin-top: 5px;
}

.mb5 {
  margin-bottom: 5px;
}

span.subText {
  font-size: 75.5%;
  vertical-align: bottom;
  position: relative;
  top: 0.1em;
}

h2 {
  font-size: 36px;
  text-align: center;
  font-weight: 600;
}

.conts--ttl {
  min-width: 1000px;
  width: 100%;
  height: 110px;
  padding-top: 30px;
  line-height: 50px;
}
.conts--ttl > h2 {
  color: #323232;
}

.conts01 .conts--ttl > h2, .conts--ttl__conts02 > h2, .conts03 .conts--ttl > h2 {
  font-size: 27px;
  font-weight: 600;
}
.conts01 .conts--ttl > h2:after, .conts--ttl__conts02 > h2:after, .conts03 .conts--ttl > h2:after {
  content: " ";
  margin: auto;
  width: 80px;
  display: block;
  border-bottom: 2px solid #5b97e9;
}

.conts01 .inner .col-01 > p, .conts02 .inner .conts2Txt, .conts03 .inner .col2Box > .col--left {
  font-size: 16px;
  line-height: 30px;
  color: #323232;
  font-weight: 300;
}

.inner {
  width: 1000px;
  margin-right: auto;
  margin-left: auto;
}

/*--------------------------------------
header
----------------------------------------*/
.header {
  width: 100%;
  height: 70px;
  position: fixed;
  top: 0;
  left: 0;
  filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr=#ccffffff,EndColorStr=#ccffffff);
  /*IE8以下用*/
  z-index: 90;
  background-color: #fff;
  -moz-box-shadow: 0px 0px 11px 0px rgba(0, 0, 0, 0.25);
  -webkit-box-shadow: 0px 0px 11px 0px rgba(0, 0, 0, 0.25);
  box-shadow: 0px 0px 11px 0px rgba(0, 0, 0, 0.25);
}

.topHeader {
  z-index: 90;
  width: 1000px;
  margin: auto;
  margin-top: 8px;
}
.topHeader h1 {
  z-index: -999;
  position: absolute;
  font-size: -99px;
  color: rgba(255, 255, 255, 0);
  display: none;
  overflow: hidden;
}
.topHeader .logo {
  display: block;
  width: 146px;
  height: 46px;
  margin-right: 40px;
  float: left;
  margin-top: 3px;
}
.topHeader .logo img {
  width: 100%;
}
.topHeader .productName {
  display: block;
  font-size: 19px;
  font-weight: 600;
  color: #323232;
  float: left;
  margin-top: 14px;
}
.topHeader .headerContact {
  margin-top: 5px;
  display: block;
  width: 188px;
  height: 40px;
  text-align: center;
  line-height: 40px;
  font-size: 16px;
  color: #fff;
  font-weight: 600;
  font-family: "Hiragino Sans","メイリオ" , Meiryo ,"Helvetica Neue" , Helvetica , Arial , Verdana , Roboto , "ヒラギノ角ゴ Pro W3" , "Hiragino Kaku Gothic Pro" , "Meiryo UI" ,  "ＭＳ Ｐゴシック" , "MS PGothic" , sans-serif;
  float: right;
  background-color: #6dcd98;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
  -moz-box-shadow: 0 6px 0 #3c9d75;
  -webkit-box-shadow: 0 6px 0 #3c9d75;
  box-shadow: 0 6px 0 #3c9d75;
}
.topHeader .headerContact:hover {
  -moz-transform: translateY(3px);
  -ms-transform: translateY(3px);
  -webkit-transform: translateY(3px);
  transform: translateY(3px);
  background-color: #93dab3;
  -moz-box-shadow: 0 3px 0 #3c9d75;
  -webkit-box-shadow: 0 3px 0 #3c9d75;
  box-shadow: 0 3px 0 #3c9d75;
  -moz-transition-duration: 0.1s;
  -o-transition-duration: 0.1s;
  -webkit-transition-duration: 0.1s;
  transition-duration: 0.1s;
}
.topHeader .headerContact:active {
  -moz-transform: translateY(6px);
  -ms-transform: translateY(6px);
  -webkit-transform: translateY(6px);
  transform: translateY(6px);
  background-color: #369e65;
  -moz-box-shadow: none;
  -webkit-box-shadow: none;
  box-shadow: none;
  -moz-transition-duration: 0.1s;
  -o-transition-duration: 0.1s;
  -webkit-transition-duration: 0.1s;
  transition-duration: 0.1s;
}

/*--------------------------------------
header 	bottom
----------------------------------------*/
.bottomHeader {
  position: relative;
  width: 100%;
  height: 70px;
  margin: auto;
  background-color: #fff;
  -moz-box-shadow: 0px 0px 11px 0px rgba(0, 0, 0, 0.25);
  -webkit-box-shadow: 0px 0px 11px 0px rgba(0, 0, 0, 0.25);
  box-shadow: 0px 0px 11px 0px rgba(0, 0, 0, 0.25);
  -moz-box-sizing: content-box;
  -webkit-box-sizing: content-box;
  box-sizing: content-box;
  margin-top: 70px;
}
.bottomHeader > ul {
  width: 1000px;
  margin: auto;
}
.bottomHeader > ul > li {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  float: left;
  height: 38px;
  line-height: 38px;
  margin-top: 15px;
  width: 333.33333px;
  font-family: "Hiragino Sans","メイリオ" , Meiryo ,"Helvetica Neue" , Helvetica , Arial , Verdana , Roboto , "ヒラギノ角ゴ Pro W3" , "Hiragino Kaku Gothic Pro" , "Meiryo UI" ,  "ＭＳ Ｐゴシック" , "MS PGothic" , sans-serif;
}
.bottomHeader > ul > li.border {
  border-left: 1px dashed rgba(60, 60, 60, 0.25);
  border-right: 1px dashed rgba(60, 60, 60, 0.25);
}
.bottomHeader > ul > li > .bb {
  text-align: center;
  display: block;
  color: #323232;
  font-weight: 600;
  font-size: 15px;
  width: 333.33333px;
  height: 38px;
  line-height: 38px;
  position: relative;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}
.bottomHeader > ul > li > .bb:after {
  position: absolute;
  bottom: .3em;
  left: 0;
  content: '';
  width: 20%;
  right: 0;
  margin: auto;
  height: 1px;
  background-color: #5b97e9;
  opacity: 0;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}
.bottomHeader > ul > li > .bb:hover:after {
  bottom: 2px;
  opacity: 1;
}

/*--------------------------------------
mainvisual
----------------------------------------*/
.mainvisual {
  width: 100%;
  min-width: 1000px;
  height: 480px;
  margin: auto;
  background-image: url("../images/mainvisual.png");
  background-repeat: repeat-x;
  background-position: center;
}
.mainvisual > .inner {
  height: 460px;
}
.mainvisual > .inner.main {
  position: relative;
}
.mainvisual > .inner > .mainzebTtl {
  position: absolute;
  right: 0;
  left: 0;
  margin: auto;
  top: 48px;
}
.mainvisual > .inner > .touroku {
  position: absolute;
  right: 0;
  left: 0;
  margin-left: auto;
  margin-right: auto;
  top: 200px;
  width: 364px;
  height: 50px;
  -moz-border-radius: 25px;
  -webkit-border-radius: 25px;
  border-radius: 25px;
}
.mainvisual > .inner > .touroku > a {
  display: block;
  width: 364px;
  height: 50px;
  background-color: #2b4679;
  -moz-border-radius: 25px;
  -webkit-border-radius: 25px;
  border-radius: 25px;
}
.mainvisual > .inner > .touroku > a > p {
  text-align: center;
  color: #fff;
  font-size: 21px;
  font-weight: 600;
  line-height: 50px;
}
.mainvisual > .inner > .touroku > a:hover {
  background-color: #385c9f;
}
.mainvisual > .inner > .txtBox {
  background-image: url("../images/mainvisual.png");
  position: absolute;
  left: 0;
  right: 0;
  overflow: hidden;
  padding: 23px;
  margin: auto;
  width: 660px;
  height: 166px;
  bottom: 20px;
  background-position-x: -370px;
  background-position-y: -273px;
  -webkit-filter: blur(4px);
  -moz-filter: blur(4px);
  -o-filter: blur(4px);
  -ms-filter: blur(4px);
  filter: blur(4px);
}
.mainvisual > .inner > .txtBox__inner {
  left: 0;
  right: 0;
  position: absolute;
  width: 660px;
  height: 166px;
  bottom: 20px;
  font-size: 16px;
  color: #323232;
  line-height: 30px;
  z-index: 2;
  padding: 23px;
  background-color: rgba(255, 255, 255, 0.4);
  margin-left: auto;
  margin-right: auto;
}
.mainvisual > .inner > .txtBox:after {
  content: " ";
  position: absolute;
  display: block;
  top: 0;
  left: 0;
  width: 660px;
  height: 166px;
}
.mainvisual > .inner > .movie {
  position: absolute;
  right: 0;
  left: 0;
  margin-left: auto;
  margin-right: auto;
  top: 220px;
  width: 688px;
}
.mainvisual > .inner > .movie .bt {
  width: 102px;
  position: absolute;
  right: 0;
  left: 0;
  top: 180px;
  margin-left: auto;
  margin-right: auto;
}
.mainvisual > .inner > .movie .bt a:hover img {
  opacity: 0.8;
}

/*--------------------------------------
lead
----------------------------------------*/
.lead {
  margin: 200px auto 50px;
}
.lead > .touroku {
  margin: 0 auto 20px;
  width: 364px;
  height: 50px;
  -moz-border-radius: 25px;
  -webkit-border-radius: 25px;
  border-radius: 25px;
}
.lead > .touroku > a {
  display: block;
  width: 364px;
  height: 50px;
  background-color: #2b4679;
  -moz-border-radius: 25px;
  -webkit-border-radius: 25px;
  border-radius: 25px;
}
.lead > .touroku > a > p {
  text-align: center;
  color: #fff;
  font-size: 21px;
  font-weight: 600;
  line-height: 50px;
}
.lead > .touroku > a:hover {
  background-color: #385c9f;
}
.lead > .txt {
  text-align: center;
  font-size: 15px;
  font-weight: 700;
}

/*--------------------------------------
conts01
----------------------------------------*/
.conts01 {
  width: 100%;
}
.conts01 .conts--ttl {
  width: 100%;
  min-width: 1000px;
  background-color: #f0f0f0;
}
.conts01 .inner .col-01 {
  width: 400px;
  margin-right: 30px;
  float: left;
}
.conts01 .inner .col-02 {
  width: 570px;
  float: left;
}

/*--------------------------------------
conts02
----------------------------------------*/
.conts--ttl__conts02 {
  width: 100%;
  height: 120px;
  min-width: 1000px;
  background-color: #2b4679;
  padding-top: 30px;
  line-height: 50px;
}
.conts--ttl__conts02 > h2 {
  color: #fff;
}

.conts02 {
  width: 100%;
  background-image: url("../images/bg_1.jpg");
  background-size: cover;
  padding-bottom: 70px;
  padding-top: 50px;
}
.conts02 .inner > h3 {
  font-size: 22px;
  color: #2b4679;
  line-height: 38px;
  text-align: center;
  font-weight: 600;
}
.conts02 .inner .conts2Txt {
  width: 622px;
  margin: auto;
  text-align: justify;
}
.conts02 .inner .hukidasi {
  width: 520px;
  height: 83px;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
  position: absolute;
  right: 0;
  left: 0;
  top: 0;
  z-index: 2;
  margin-left: auto;
  margin-right: auto;
}
.conts02 .hukidasiConts {
  position: relative;
  width: 1000px;
  height: 314px;
}
.conts02--hero {
  width: 1000px;
  position: absolute;
  top: 40px;
  height: 260px;
  border: 1px solid #fff;
  background-color: rgba(255, 255, 255, 0.3);
  -moz-border-radius: 8px;
  -webkit-border-radius: 8px;
  border-radius: 8px;
  padding: 20px;
}
.conts02--hero__inner {
  width: 960px;
  height: 200px;
  position: absolute;
  bottom: 10px;
  left: 0;
  right: 0;
  margin-left: auto;
  margin-right: auto;
}
.conts02--hero__inner > .box {
  width: 151px;
  height: 180px;
  -moz-border-radius: 4px;
  -webkit-border-radius: 4px;
  border-radius: 4px;
  background-color: rgba(255, 255, 255, 0.9);
  float: left;
  position: relative;
}
.conts02--hero__inner > .box.l {
  margin-left: 10px;
}
.conts02--hero__inner > .box > .icon {
  position: absolute;
  width: 110px;
  height: 110px;
  top: 20px;
  left: 0;
  right: 0;
  margin-left: auto;
  margin-right: auto;
}
.conts02--hero__inner > .box > .name {
  font-size: 17px;
  color: #2b4679;
  font-weight: 600;
  position: absolute;
  bottom: 25px;
  right: 0;
  left: 0;
  text-align: center;
  margin-left: auto;
  margin-right: auto;
}

/*--------------------------------------
conts3
----------------------------------------*/
.conts03 {
  width: 100%;
  min-width: 1000px;
  background-color: #f0f0f0;
  padding-bottom: 60px;
}
.conts03 .conts--ttl {
  width: 100%;
  height: 120px;
  min-width: 1000px;
  background-color: #2b4679;
}
.conts03 .conts--ttl > h2 {
  color: #fff;
}
.conts03 .title {
  display: block;
  width: 610px;
  height: 42px;
  background-color: #fff;
  -moz-border-radius: 21px;
  -webkit-border-radius: 21px;
  border-radius: 21px;
  margin: auto;
  text-align: center;
  font-size: 16px;
  font-weight: 600;
  line-height: 42px;
}
.conts03__txt {
  width: 610px;
  height: auto;
  margin-left: auto;
  margin-right: auto;
}
.conts03 .inner > h3 {
  font-size: 22px;
  color: #2b4679;
  text-align: center;
  font-weight: 600;
}
.conts03 .inner .col2Box {
  width: 1000px;
}
.conts03 .inner .col2Box > .col--left {
  width: 421px;
  padding: 22px 30px;
  background-color: #e1e1e1;
  float: left;
}
.conts03 .inner .col2Box > .col--left.cap {
  font-size: 12px;
}
.conts03 .inner .col2Box > .col--left .col--left--ttl {
  font-size: 16px;
  font-weight: 600;
}
.conts03 .inner .col2Box > .col--left .table table {
  width: 332px;
}
.conts03 .inner .col2Box > .col--left .table .th {
  width: 112px !important;
  border-bottom: 1px solid #c8c8c8;
  font-size: 14px;
}
.conts03 .inner .col2Box > .col--left .table .td {
  border-bottom: 1px solid #c8c8c8;
  font-size: 14px;
}
.conts03 .inner .col2Box > .col--left .table th {
  font-size: 14px;
}
.conts03 .inner .col2Box > .col--left .table td {
  font-size: 14px;
  line-height: 1.6;
  padding-top: 5px;
  padding-bottom: 5px;
}
.conts03 .inner .col2Box > .col--left.didn {
  height: 392px;
}
.conts03 .inner .col2Box > .col {
  float: left;
  width: 460px;
}
.conts03 .inner .imgBox {
  width: 1000px;
  position: relative;
}
.conts03 .inner .imgBox a.taiyoukou {
  position: absolute;
  width: 90px;
  height: 36px;
  top: 25px;
  left: 220px;
}
.conts03 .inner .imgBox a.led {
  position: absolute;
  width: 120px;
  height: 36px;
  top: 161px;
  left: 187px;
}
.conts03 .inner .imgBox a.bems {
  position: absolute;
  width: 65px;
  height: 36px;
  top: 212px;
  left: 241px;
}
.conts03 .inner .introductionList {
  width: 1000px;
}
.conts03 .inner .introductionList--ttl {
  font-size: 16px;
  font-weight: 600;
}
.conts03 .inner .introductionList__inner {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.conts03 .inner .introductionList__inner > li {
  float: left;
}
.conts03 .inner .introductionList__inner > li > ul {
  width: 100%;
}
.conts03 .inner .introductionList__inner > li > ul > li > p {
  font-size: 12px;
}
.conts03 .inner .introductionList__inner > li > .ttl {
  font-size: 14px;
  color: #2b4679;
  font-weight: 600;
  margin-bottom: 10px;
}
.conts03 .inner .introductionList__inner > li.syo {
  width: 387px;
  margin-right: 20px;
}
.conts03 .inner .introductionList__inner > li.syo .syoBox {
  width: 100%;
  border-top: 1px solid #c8c8c8;
}
.conts03 .inner .introductionList__inner > li.syo .syoBox > ul {
  float: left;
}
.conts03 .inner .introductionList__inner > li.syo .syoBox > ul.l {
  width: 200px;
}
.conts03 .inner .introductionList__inner > li.syo .syoBox > ul > li {
  list-style: disc;
  margin-left: 20px;
}
.conts03 .inner .introductionList__inner > li.syo .syoBox > ul > li > p {
  font-size: 12px;
}
.conts03 .inner .introductionList__inner > li.sou {
  width: 186px;
  margin-right: 20px;
  height: 200px;
}
.conts03 .inner .introductionList__inner > li.sou > ul {
  border-top: 1px solid #c8c8c8;
}
.conts03 .inner .introductionList__inner > li.dan {
  width: 180px;
  margin-right: 20px;
  height: 200px;
}
.conts03 .inner .introductionList__inner > li.dan > ul {
  border-top: 1px solid #c8c8c8;
}
.conts03 .inner .introductionList__inner > li.kan {
  width: 187px;
  height: 200px;
}
.conts03 .inner .introductionList__inner > li.kan > ul {
  border-top: 1px solid #c8c8c8;
}
.conts03 .inner .introductionList__inner > li.col3 {
  width: 320px;
  height: 150px;
  margin-right: 20px;
}
.conts03 .inner .introductionList__inner > li.col3 > ul {
  border-top: 1px solid #c8c8c8;
}
.conts03 .inner .introductionList__inner > li.col3.nene {
  height: 220px;
}
.conts03 .inner .introductionList__inner > li.col3.lst {
  margin-right: 0;
}
.conts03 .inner .after {
  width: 1000px;
  padding: 20px 30px;
  background-color: #fff;
}
.conts03 .inner .after > .ttl {
  font-size: 14px;
  color: #2b4679;
  font-weight: 600;
  text-align: center;
}
.conts03 .inner .after__inner .col {
  width: 455px;
  float: left;
}
.conts03 .inner .after__inner .col > p {
  font-size: 12px;
  line-height: 23px;
}
.conts03 .inner .after__inner .col.l {
  margin-right: 30px;
}

/*--------------------------------------
conts4
----------------------------------------*/
.conts04 {
  width: 100%;
  height: 420px;
  min-width: 1000px;
  background-image: url("../images/bg_2.jpg");
  background-size: cover;
  padding-top: 65px;
}
.conts04 > p {
  text-align: center;
  font-size: 18px;
  color: #fff;
}
.conts04 .conts05Conts {
  margin: auto;
  margin-top: 5px;
  display: block;
  width: 340px;
  height: 70px;
  text-align: center;
  line-height: 70px;
  font-size: 24px;
  color: #fff;
  font-weight: 500;
  background-color: #6dcd98;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
  -moz-box-shadow: 0 6px 0 #3c9d75;
  -webkit-box-shadow: 0 6px 0 #3c9d75;
  box-shadow: 0 6px 0 #3c9d75;
}
.conts04 .conts05Conts:hover {
  -moz-transform: translateY(3px);
  -ms-transform: translateY(3px);
  -webkit-transform: translateY(3px);
  transform: translateY(3px);
  background-color: #93dab3;
  -moz-box-shadow: 0 3px 0 #5ac68b;
  -webkit-box-shadow: 0 3px 0 #5ac68b;
  box-shadow: 0 3px 0 #5ac68b;
  -moz-transition-duration: 0.1s;
  -o-transition-duration: 0.1s;
  -webkit-transition-duration: 0.1s;
  transition-duration: 0.1s;
}
.conts04 .conts05Conts:active {
  -moz-transform: translateY(6px);
  -ms-transform: translateY(6px);
  -webkit-transform: translateY(6px);
  transform: translateY(6px);
  background-color: #369e65;
  -moz-box-shadow: none;
  -webkit-box-shadow: none;
  box-shadow: none;
  -moz-transition-duration: 0.1s;
  -o-transition-duration: 0.1s;
  -webkit-transition-duration: 0.1s;
  transition-duration: 0.1s;
}
.conts04 > .col > p {
  text-align: center;
  font-size: 18px;
  color: #fff;
}
.conts04 > .col > p.tel {
  display: block;
  width: 345px;
  height: 36px;
  font-size: 36px;
  font-weight: 600;
  position: relative;
  margin-right: auto;
  margin-left: auto;
  text-align: right;
}
.conts04 > .col > p.tel:before {
  display: block;
  width: 51px;
  height: 29px;
  position: absolute;
  float: left;
  left: -14px;
  top: -2px;
  content: url(../images/free-dial.png);
}
.conts04 > p > a{
  color:#fff;
}
/*--------------------------------------
copy
----------------------------------------*/
.copy2 {
  width: 1000px;
  margin: auto;
  text-align: center;
  height: 62px;
  line-height: 62px;
}
.copy2 > p {
  font-family: "Hiragino Sans","メイリオ" , Meiryo ,"Helvetica Neue" , Helvetica , Arial , Verdana , Roboto , "ヒラギノ角ゴ Pro W3" , "Hiragino Kaku Gothic Pro" , "Meiryo UI" ,  "ＭＳ Ｐゴシック" , "MS PGothic" , sans-serif;
}

/*--------------------------------------
pagetop
----------------------------------------*/
#page_top {
  z-index: 2;
  position: fixed;
  bottom: 20px;
  right: 20px;
}

/*--------------------------------------
header　　2017/07/13 追加
----------------------------------------*/
.header {
  width: 100%;
  height: 70px;
  position: fixed;
  top: 0;
  left: 0;
  filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr=#ccffffff,EndColorStr=#ccffffff);
  /*IE8以下用*/
  z-index: 90;
  background-color: #fff;
  -moz-box-shadow: 0px 0px 11px 0px rgba(0, 0, 0, 0.25);
  -webkit-box-shadow: 0px 0px 11px 0px rgba(0, 0, 0, 0.25);
  box-shadow: 0px 0px 11px 0px rgba(0, 0, 0, 0.25);
}

.productName {
  text-decoration: none;
}

.topHeader {
  z-index: 90;
  width: 1000px;
  margin: auto;
  margin-top: 8px;
}

.topHeader h1 {
  z-index: -999;
  position: absolute;
  font-size: -99px;
  color: rgba(255, 255, 255, 0);
  display: none;
  overflow: hidden;
}

.topHeader .logo {
  display: block;
  width: 146px;
  height: 46px;
  margin-right: 62px;
  float: left;
  margin-top: 3px;
}

.topHeader .logo img {
  width: 100%;
}

.topHeader .productName {
  display: block;
  font-size: 19px;
  font-weight: 600;
  color: #323232;
  float: left;
  margin-top: 14px;
  width: 300px;
}
.topHeader .productName > img {
  width: 100%;
}

.topHeader .headerContact {
  display: block;
  width: 188px;
  height: 40px;
  text-align: center;
  line-height: 40px;
  font-size: 16px;
  color: #fff;
  font-weight: 600;
  font-family: "Hiragino Sans","メイリオ" , Meiryo ,"Helvetica Neue" , Helvetica , Arial , Verdana , Roboto , "ヒラギノ角ゴ Pro W3" , "Hiragino Kaku Gothic Pro" , "Meiryo UI" ,  "ＭＳ Ｐゴシック" , "MS PGothic" , sans-serif;
  float: right;
  background-color: #5b97e9;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
  -moz-box-shadow: 0 6px 0 #1d6bd6;
  -webkit-box-shadow: 0 6px 0 #1d6bd6;
  box-shadow: 0 6px 0 #1d6bd6;
  text-decoration: none;
}

.topHeader .headerContact:hover {
  -moz-transform: translateY(3px);
  -ms-transform: translateY(3px);
  -webkit-transform: translateY(3px);
  transform: translateY(3px);
  background-color: #88b4ef;
  -moz-box-shadow: 0 3px 0 #1d6bd6;
  -webkit-box-shadow: 0 3px 0 #1d6bd6;
  box-shadow: 0 3px 0 #1d6bd6;
  -moz-transition-duration: 0.1s;
  -o-transition-duration: 0.1s;
  -webkit-transition-duration: 0.1s;
  transition-duration: 0.1s;
}

.topHeader .headerContact:active {
  -moz-transform: translateY(6px);
  -ms-transform: translateY(6px);
  -webkit-transform: translateY(6px);
  transform: translateY(6px);
  background-color: #1d6bd6;
  -moz-box-shadow: none;
  -webkit-box-shadow: none;
  box-shadow: none;
  -moz-transition-duration: 0.1s;
  -o-transition-duration: 0.1s;
  -webkit-transition-duration: 0.1s;
  transition-duration: 0.1s;
}

.h__translation {
  width: auto;
  height: auto;
  margin-top: 10px;
  float: left;
}

.h_nav {
  width: 408px;
  float: right;
  text-align: right;
  float: right;
}

.h__tel {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding-left: 19px;
  border-left: none !important;
  width: 210px;
  height: 39px;
  float: left;
}

.h__tel__txt01 {
  font-size: 11px;
  text-align: left;
  margin-top: 8px;
  line-height: 16px;
  font-family: "Hiragino Sans","メイリオ" , Meiryo ,"Helvetica Neue" , Helvetica , Arial , Verdana , Roboto , "ヒラギノ角ゴ Pro W3" , "Hiragino Kaku Gothic Pro" , "Meiryo UI" ,  "ＭＳ Ｐゴシック" , "MS PGothic" , sans-serif;
}

.h__tel__txt02 {
  font-size: 18px;
  font-weight: bold;
  text-align: left;
  font-family: "Hiragino Sans","メイリオ" , Meiryo ,"Helvetica Neue" , Helvetica , Arial , Verdana , Roboto , "ヒラギノ角ゴ Pro W3" , "Hiragino Kaku Gothic Pro" , "Meiryo UI" ,  "ＭＳ Ｐゴシック" , "MS PGothic" , sans-serif;
}

.h__tel__txt02 > span {
  display: block;
  width: 26px;
  height: 15px;
  background-image: url(../images/h__tel-icon.png);
  float: left;
  margin-top: 3px;
  margin-right: 5px;
  font-size: 0.0000001px;
  color: rgba(255, 255, 255, 0);
}

.h__contact {
  width: auto;
  height: 39px;
  float: right;
}


.modal-movie { position: relative; color: transparent; }
/* .modal-movie:before { position: absolute; content: ""; width: 80px; height: 80px; top: -170px; left: 50%; margin-left: -40px; background: #FFF; box-shadow: 0 0 10px rgba(0, 0, 0, 0.5); border-radius: 50%; -moz-transition: all 0.2s ease; -o-transition: all 0.2s ease; -webkit-transition: all 0.2s ease; transition: all 0.2s ease; z-index: 5; } */
/* .modal-movie:after { position: absolute; content: "▲"; font-size: 38px; color: #CC0033; top: -142px; left: 50%; margin-left: -12px; -moz-transform: rotate(90deg); -webkit-transform: rotate(90deg); transform: rotate(90deg); -moz-transition: all 0.2s ease; -o-transition: all 0.2s ease; -webkit-transition: all 0.2s ease; transition: all 0.2s ease; z-index: 5; } */
.modal-movie > img { opacity: 1; -moz-transition: all 0.2s ease; -o-transition: all 0.2s ease; -webkit-transition: all 0.2s ease; transition: all 0.2s ease; }
.modal-movie > img:hover { opacity: .7; }
.modal-movie:hover:before { background: #CC0033; }
.modal-movie:hover:after { color: #FFF; }

.modal-movie-inline { display: none; }
.modal-movie-inline-head { margin-bottom: 30px; }

video{
	width:100%;
	height:auto;
}

/* モーダル設定
-----------------------------------------------------------------*/
/*!
	Modaal - accessible modals - v0.3.1
	by Humaan, for all humans.
	http://humaan.com
 */
 .modaal-noscroll { overflow: hidden; }

.modaal-accessible-hide { position: absolute !important; clip: rect(1px 1px 1px 1px); /* IE6, IE7 */ clip: rect(1px, 1px, 1px, 1px); padding: 0 !important; border: 0 !important; height: 1px !important; width: 1px !important; overflow: hidden; }

.modaal-overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 999; opacity: 0; }

.modaal-wrapper { display: block; position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 9999; overflow: auto; opacity: 1; box-sizing: border-box; -webkit-overflow-scrolling: touch; transition: all 0.3s ease-in-out; }
.modaal-wrapper * { box-sizing: border-box; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; -webkit-backface-visibility: hidden; }
.modaal-wrapper .modaal-close { border: none; background: transparent; padding: 0; -webkit-appearance: none; }
.modaal-wrapper.modaal-start_none { display: none; opacity: 1; }
.modaal-wrapper.modaal-start_fade { opacity: 0; }
.modaal-wrapper *[tabindex="0"] { outline: none !important; }
.modaal-wrapper.modaal-fullscreen { overflow: hidden; }

.modaal-outer-wrapper { display: table; position: relative; width: 100%; height: 100%; }
.modaal-fullscreen .modaal-outer-wrapper { display: block; }

.modaal-inner-wrapper { display: table-cell; width: 100%; height: 100%; position: relative; vertical-align: middle; text-align: center; padding: 80px 25px; }
.modaal-fullscreen .modaal-inner-wrapper { padding: 0; display: block; vertical-align: top; }

.modaal-container { position: relative; display: inline-block; width: 100%; margin: auto; text-align: left; color: #000; max-width: 1000px; border-radius: 0px; background: #fff; box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2); cursor: auto; }
.modaal-container.is_loading { height: 100px; width: 100px; overflow: hidden; }
.modaal-fullscreen .modaal-container { max-width: none; height: 100%; overflow: auto; }

.modaal-close { position: fixed; right: 20px; top: 20px; color: #fff; cursor: pointer; opacity: 1; width: 50px; height: 50px; background: transparent; border-radius: 100%; transition: all 0.2s ease-in-out; }
.modaal-close:focus, .modaal-close:hover { outline: none; background: #fff; }
.modaal-close:focus:before, .modaal-close:focus:after, .modaal-close:hover:before, .modaal-close:hover:after { background: #b93d0c; }
.modaal-close span { position: absolute !important; clip: rect(1px 1px 1px 1px); /* IE6, IE7 */ clip: rect(1px, 1px, 1px, 1px); padding: 0 !important; border: 0 !important; height: 1px !important; width: 1px !important; overflow: hidden; }
.modaal-close:before, .modaal-close:after { display: block; content: " "; position: absolute; top: 14px; left: 23px; width: 4px; height: 22px; border-radius: 4px; background: #fff; transition: background 0.2s ease-in-out; }
.modaal-close:before { transform: rotate(-45deg); }
.modaal-close:after { transform: rotate(45deg); }
.modaal-fullscreen .modaal-close { background: #afb7bc; right: 10px; top: 10px; }

.modaal-content-container { padding: 30px; }

.modaal-confirm-wrap { padding: 30px 0 0; text-align: center; font-size: 0; }

.modaal-confirm-btn { font-size: 14px; display: inline-block; margin: 0 10px; vertical-align: middle; cursor: pointer; border: none; background: transparent; }
.modaal-confirm-btn.modaal-ok { padding: 10px 15px; color: #fff; background: #555; border-radius: 3px; transition: background 0.2s ease-in-out; }
.modaal-confirm-btn.modaal-ok:hover { background: #2f2f2f; }
.modaal-confirm-btn.modaal-cancel { text-decoration: underline; }
.modaal-confirm-btn.modaal-cancel:hover { text-decoration: none; color: #2f2f2f; }

@keyframes instaReveal { 0% { opacity: 0; }
  100% { opacity: 1; } }
@-o-keyframes instaReveal { 0% { opacity: 0; }
  100% { opacity: 1; } }
@-moz-keyframes instaReveal { 0% { opacity: 0; }
  100% { opacity: 1; } }
@-webkit-keyframes instaReveal { 0% { opacity: 0; }
  100% { opacity: 1; } }
@-ms-keyframes instaReveal { 0% { opacity: 0; }
  100% { opacity: 1; } }
.modaal-instagram .modaal-container { width: auto; background: transparent; box-shadow: none !important; }
.modaal-instagram .modaal-content-container { padding: 0; background: transparent; }
.modaal-instagram .modaal-content-container > blockquote { width: 1px !important; height: 1px !important; opacity: 0 !important; }
.modaal-instagram iframe { opacity: 0; margin: -6px !important; border-radius: 0 !important; width: 1000px !important; max-width: 800px !important; box-shadow: none !important; animation: instaReveal 1s linear forwards; }

.modaal-image .modaal-inner-wrapper { padding-left: 140px; padding-right: 140px; }
.modaal-image .modaal-container { width: auto; max-width: 100%; }

.modaal-gallery-wrap { position: relative; color: #fff; }

.modaal-gallery-item { display: none; }
.modaal-gallery-item img { display: block; }
.modaal-gallery-item.is_active { display: block; }

.modaal-gallery-label { position: absolute; left: 0; width: 100%; margin: 20px 0 0; font-size: 18px; text-align: center; color: #fff; }
.modaal-gallery-label:focus { outline: none; }

.modaal-gallery-control { position: absolute; top: 50%; transform: translateY(-50%); opacity: 1; cursor: pointer; color: #fff; width: 50px; height: 50px; background: transparent; border: none; border-radius: 100%; transition: all 0.2s ease-in-out; }
.modaal-gallery-control.is_hidden { opacity: 0; cursor: default; }
.modaal-gallery-control:focus, .modaal-gallery-control:hover { outline: none; background: #fff; }
.modaal-gallery-control:focus:before, .modaal-gallery-control:focus:after, .modaal-gallery-control:hover:before, .modaal-gallery-control:hover:after { background: #afb7bc; }
.modaal-gallery-control span { position: absolute !important; clip: rect(1px 1px 1px 1px); /* IE6, IE7 */ clip: rect(1px, 1px, 1px, 1px); padding: 0 !important; border: 0 !important; height: 1px !important; width: 1px !important; overflow: hidden; }
.modaal-gallery-control:before, .modaal-gallery-control:after { display: block; content: " "; position: absolute; top: 16px; left: 25px; width: 4px; height: 18px; border-radius: 4px; background: #fff; transition: background 0.2s ease-in-out; }
.modaal-gallery-control:before { margin: -5px 0 0; transform: rotate(-45deg); }
.modaal-gallery-control:after { margin: 5px 0 0; transform: rotate(45deg); }

.modaal-gallery-next { left: 100%; margin-left: 40px; }

.modaal-gallery-prev { right: 100%; margin-right: 40px; }
.modaal-gallery-prev:before, .modaal-gallery-prev:after { left: 22px; }
.modaal-gallery-prev:before { margin: 5px 0 0; transform: rotate(-45deg); }
.modaal-gallery-prev:after { margin: -5px 0 0; transform: rotate(45deg); }

.modaal-video-wrap { margin: auto 50px; position: relative; }

.modaal-video-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; box-shadow: 0 0 10px rgba(0, 0, 0, 0.3); background: #000; max-width: 1300px; margin-left: auto; margin-right: auto; }
.modaal-video-container iframe, .modaal-video-container object, .modaal-video-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

.modaal-iframe .modaal-content { width: 100%; height: 100%; }

.modaal-iframe-elem { width: 100%; height: 100%; display: block; }

@media only screen and (min-width: 1400px) { .modaal-video-container { padding-bottom: 0; height: 731px; } }
@media only screen and (max-width: 1140px) { .modaal-image .modaal-inner-wrapper { padding-left: 25px; padding-right: 25px; }
  .modaal-gallery-control { top: auto; bottom: 20px; transform: none; background: rgba(0, 0, 0, 0.7); }
  .modaal-gallery-control:before, .modaal-gallery-control:after { background: #fff; }
  .modaal-gallery-next { left: auto; right: 20px; }
  .modaal-gallery-prev { left: 20px; right: auto; } }
@media screen and (max-width: 900px) { .modaal-instagram iframe { width: 500px !important; } }
@media screen and (max-height: 1100px) { .modaal-instagram iframe { width: 700px !important; } }
@media screen and (max-height: 1000px) { .modaal-inner-wrapper { padding-top: 60px; padding-bottom: 60px; }
  .modaal-instagram iframe { width: 600px !important; } }
@media screen and (max-height: 900px) { .modaal-instagram iframe { width: 500px !important; }
  .modaal-video-container { max-width: 900px; max-height: 510px; } }
@media only screen and (max-width: 600px) { .modaal-instagram iframe { width: 280px !important; } }
@media only screen and (max-height: 820px) { .modaal-gallery-label { display: none; } }
.modaal-loading-spinner { background: none; position: absolute; width: 200px; height: 200px; top: 50%; left: 50%; margin: -100px 0 0 -100px; transform: scale(0.25); }

@-ms-keyframes modaal-loading-spinner { 0% { opacity: 1; -ms-transform: scale(1.5); -moz-transform: scale(1.5); -webkit-transform: scale(1.5); -o-transform: scale(1.5); transform: scale(1.5); }
  100% { opacity: .1; -ms-transform: scale(1); -moz-transform: scale(1); -webkit-transform: scale(1); -o-transform: scale(1); transform: scale(1); } }
@-moz-keyframes modaal-loading-spinner { 0% { opacity: 1; -ms-transform: scale(1.5); -moz-transform: scale(1.5); -webkit-transform: scale(1.5); -o-transform: scale(1.5); transform: scale(1.5); }
  100% { opacity: .1; -ms-transform: scale(1); -moz-transform: scale(1); -webkit-transform: scale(1); -o-transform: scale(1); transform: scale(1); } }
@-webkit-keyframes modaal-loading-spinner { 0% { opacity: 1; -ms-transform: scale(1.5); -moz-transform: scale(1.5); -webkit-transform: scale(1.5); -o-transform: scale(1.5); transform: scale(1.5); }
  100% { opacity: .1; -ms-transform: scale(1); -moz-transform: scale(1); -webkit-transform: scale(1); -o-transform: scale(1); transform: scale(1); } }
@-o-keyframes modaal-loading-spinner { 0% { opacity: 1; -ms-transform: scale(1.5); -moz-transform: scale(1.5); -webkit-transform: scale(1.5); -o-transform: scale(1.5); transform: scale(1.5); }
  100% { opacity: .1; -ms-transform: scale(1); -moz-transform: scale(1); -webkit-transform: scale(1); -o-transform: scale(1); transform: scale(1); } }
@keyframes modaal-loading-spinner { 0% { opacity: 1; -ms-transform: scale(1.5); -moz-transform: scale(1.5); -webkit-transform: scale(1.5); -o-transform: scale(1.5); transform: scale(1.5); }
  100% { opacity: .1; -ms-transform: scale(1); -moz-transform: scale(1); -webkit-transform: scale(1); -o-transform: scale(1); transform: scale(1); } }
.modaal-loading-spinner > div { width: 24px; height: 24px; margin-left: 4px; margin-top: 4px; position: absolute; }

.modaal-loading-spinner > div > div { width: 100%; height: 100%; border-radius: 15px; background: #fff; }

.modaal-loading-spinner > div:nth-of-type(1) > div { -ms-animation: modaal-loading-spinner 1s linear infinite; -moz-animation: modaal-loading-spinner 1s linear infinite; -webkit-animation: modaal-loading-spinner 1s linear infinite; -o-animation: modaal-loading-spinner 1s linear infinite; animation: modaal-loading-spinner 1s linear infinite; -ms-animation-delay: 0s; -moz-animation-delay: 0s; -webkit-animation-delay: 0s; -o-animation-delay: 0s; animation-delay: 0s; }

.modaal-loading-spinner > div:nth-of-type(2) > div, .modaal-loading-spinner > div:nth-of-type(3) > div { -ms-animation: modaal-loading-spinner 1s linear infinite; -moz-animation: modaal-loading-spinner 1s linear infinite; -webkit-animation: modaal-loading-spinner 1s linear infinite; -o-animation: modaal-loading-spinner 1s linear infinite; }

.modaal-loading-spinner > div:nth-of-type(1) { -ms-transform: translate(84px, 84px) rotate(45deg) translate(70px, 0); -moz-transform: translate(84px, 84px) rotate(45deg) translate(70px, 0); -webkit-transform: translate(84px, 84px) rotate(45deg) translate(70px, 0); -o-transform: translate(84px, 84px) rotate(45deg) translate(70px, 0); transform: translate(84px, 84px) rotate(45deg) translate(70px, 0); }

.modaal-loading-spinner > div:nth-of-type(2) > div { animation: modaal-loading-spinner 1s linear infinite; -ms-animation-delay: .12s; -moz-animation-delay: .12s; -webkit-animation-delay: .12s; -o-animation-delay: .12s; animation-delay: .12s; }

.modaal-loading-spinner > div:nth-of-type(2) { -ms-transform: translate(84px, 84px) rotate(90deg) translate(70px, 0); -moz-transform: translate(84px, 84px) rotate(90deg) translate(70px, 0); -webkit-transform: translate(84px, 84px) rotate(90deg) translate(70px, 0); -o-transform: translate(84px, 84px) rotate(90deg) translate(70px, 0); transform: translate(84px, 84px) rotate(90deg) translate(70px, 0); }

.modaal-loading-spinner > div:nth-of-type(3) > div { animation: modaal-loading-spinner 1s linear infinite; -ms-animation-delay: .25s; -moz-animation-delay: .25s; -webkit-animation-delay: .25s; -o-animation-delay: .25s; animation-delay: .25s; }

.modaal-loading-spinner > div:nth-of-type(4) > div, .modaal-loading-spinner > div:nth-of-type(5) > div { -ms-animation: modaal-loading-spinner 1s linear infinite; -moz-animation: modaal-loading-spinner 1s linear infinite; -webkit-animation: modaal-loading-spinner 1s linear infinite; -o-animation: modaal-loading-spinner 1s linear infinite; }

.modaal-loading-spinner > div:nth-of-type(3) { -ms-transform: translate(84px, 84px) rotate(135deg) translate(70px, 0); -moz-transform: translate(84px, 84px) rotate(135deg) translate(70px, 0); -webkit-transform: translate(84px, 84px) rotate(135deg) translate(70px, 0); -o-transform: translate(84px, 84px) rotate(135deg) translate(70px, 0); transform: translate(84px, 84px) rotate(135deg) translate(70px, 0); }

.modaal-loading-spinner > div:nth-of-type(4) > div { animation: modaal-loading-spinner 1s linear infinite; -ms-animation-delay: .37s; -moz-animation-delay: .37s; -webkit-animation-delay: .37s; -o-animation-delay: .37s; animation-delay: .37s; }

.modaal-loading-spinner > div:nth-of-type(4) { -ms-transform: translate(84px, 84px) rotate(180deg) translate(70px, 0); -moz-transform: translate(84px, 84px) rotate(180deg) translate(70px, 0); -webkit-transform: translate(84px, 84px) rotate(180deg) translate(70px, 0); -o-transform: translate(84px, 84px) rotate(180deg) translate(70px, 0); transform: translate(84px, 84px) rotate(180deg) translate(70px, 0); }

.modaal-loading-spinner > div:nth-of-type(5) > div { animation: modaal-loading-spinner 1s linear infinite; -ms-animation-delay: .5s; -moz-animation-delay: .5s; -webkit-animation-delay: .5s; -o-animation-delay: .5s; animation-delay: .5s; }

.modaal-loading-spinner > div:nth-of-type(6) > div, .modaal-loading-spinner > div:nth-of-type(7) > div { -ms-animation: modaal-loading-spinner 1s linear infinite; -moz-animation: modaal-loading-spinner 1s linear infinite; -webkit-animation: modaal-loading-spinner 1s linear infinite; -o-animation: modaal-loading-spinner 1s linear infinite; }

.modaal-loading-spinner > div:nth-of-type(5) { -ms-transform: translate(84px, 84px) rotate(225deg) translate(70px, 0); -moz-transform: translate(84px, 84px) rotate(225deg) translate(70px, 0); -webkit-transform: translate(84px, 84px) rotate(225deg) translate(70px, 0); -o-transform: translate(84px, 84px) rotate(225deg) translate(70px, 0); transform: translate(84px, 84px) rotate(225deg) translate(70px, 0); }

.modaal-loading-spinner > div:nth-of-type(6) > div { animation: modaal-loading-spinner 1s linear infinite; -ms-animation-delay: .62s; -moz-animation-delay: .62s; -webkit-animation-delay: .62s; -o-animation-delay: .62s; animation-delay: .62s; }

.modaal-loading-spinner > div:nth-of-type(6) { -ms-transform: translate(84px, 84px) rotate(270deg) translate(70px, 0); -moz-transform: translate(84px, 84px) rotate(270deg) translate(70px, 0); -webkit-transform: translate(84px, 84px) rotate(270deg) translate(70px, 0); -o-transform: translate(84px, 84px) rotate(270deg) translate(70px, 0); transform: translate(84px, 84px) rotate(270deg) translate(70px, 0); }

.modaal-loading-spinner > div:nth-of-type(7) > div { animation: modaal-loading-spinner 1s linear infinite; -ms-animation-delay: .75s; -moz-animation-delay: .75s; -webkit-animation-delay: .75s; -o-animation-delay: .75s; animation-delay: .75s; }

.modaal-loading-spinner > div:nth-of-type(7) { -ms-transform: translate(84px, 84px) rotate(315deg) translate(70px, 0); -moz-transform: translate(84px, 84px) rotate(315deg) translate(70px, 0); -webkit-transform: translate(84px, 84px) rotate(315deg) translate(70px, 0); -o-transform: translate(84px, 84px) rotate(315deg) translate(70px, 0); transform: translate(84px, 84px) rotate(315deg) translate(70px, 0); }

.modaal-loading-spinner > div:nth-of-type(8) > div { -ms-animation: modaal-loading-spinner 1s linear infinite; -moz-animation: modaal-loading-spinner 1s linear infinite; -webkit-animation: modaal-loading-spinner 1s linear infinite; -o-animation: modaal-loading-spinner 1s linear infinite; animation: modaal-loading-spinner 1s linear infinite; -ms-animation-delay: .87s; -moz-animation-delay: .87s; -webkit-animation-delay: .87s; -o-animation-delay: .87s; animation-delay: .87s; }

.modaal-loading-spinner > div:nth-of-type(8) { -ms-transform: translate(84px, 84px) rotate(360deg) translate(70px, 0); -moz-transform: translate(84px, 84px) rotate(360deg) translate(70px, 0); -webkit-transform: translate(84px, 84px) rotate(360deg) translate(70px, 0); -o-transform: translate(84px, 84px) rotate(360deg) translate(70px, 0); transform: translate(84px, 84px) rotate(360deg) translate(70px, 0); }

.modaal-container { text-align: center; }

.modaal-content-container { padding: 0; }
.special .modaal-content-container { line-height: 0; }
.modaal-content-container > video { width: 100%; vertical-align: bottom; }

.modaal-wrapper .modaal-close { position: absolute; top: 0; right: -50px; background: #AAA; border-radius: 0; }
.modaal-wrapper .modaal-close:hover { background: #999; }
.modaal-wrapper .modaal-close:hover:before, .modaal-wrapper .modaal-close:hover:after { background: #FFF; }

.modaal-video-container { box-shadow: none; background: transparent; }