@charset "utf-8";
/*
html5doctor.com Reset Stylesheet
v1.6.1
Last Updated: 2010-09-17
Author: Richard Clark - http://richclarkdesign.com
Twitter: @rich_clark
*/

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

body {
    line-height:1;
}

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

nav ul {
    list-style:none;
}

blockquote, q {
    quotes:none;
}

blockquote:before, blockquote:after,
q:before, q:after {
    content:'';
    content:none;
}

a {
    margin:0;
    padding:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
}

/* change colours to suit your needs */
ins {
    background-color:#ff9;
    color:#000;
    text-decoration:none;
}

/* change colours to suit your needs */
mark {
    background-color:#ff9;
    color:#000;
    font-style:italic;
    font-weight:bold;
}

del {
    text-decoration: line-through;
}

abbr[title], dfn[title] {
    border-bottom:1px dotted;
    cursor:help;
}

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

/* change border colour to suit your needs */
hr {
    display:block;
    height:1px;
    border:0;  
    border-top:1px solid #cccccc;
    margin:1em 0;
    padding:0;
}

input, select {
    vertical-align:middle;
}

/* 
  2020 GP トップページリニューアル
*/

html,
body {
  width: 100%;
  font-family: "SST W20 Roman", "SST W55 Regular", "Yu Gothic Medium", "YuGothic", sans-serif;
}
h2,
h3,
.font-bold {
  /* font-family: "SST W15 Bold", "SST W55 Bold", "Yu Gothic", "YuGothic", sans-serif; */
  font-family: "SST W15 Bold", "SST W55 Bold", "Hiragino Sans W6", "Yu Gothic Demibold", "YuGothic", sans-serif;
  font-weight: normal;
}

a {
  text-decoration: none;
}

li {
  list-style: none;
}

.sp {
  display: none;
}

img,
.js-bgImg {
  opacity: 0;
  transition: .4s opacity cubic-bezier(0, 0, 0.4, 1);
}

.head_important {
  width: 942px;
  /* width: 1190px; */
  margin: 30px auto 22px;
}
.head_important-disaster {
  width: 942px;
  border-bottom: 1px solid #E0E0E0;
  padding-bottom: 30px;
  margin: 40px auto 56px;
}

.head_important_ttl {
  font-size: 14px;
  font-family: "SST W15 Bold", "SST W55 Bold", "Hiragino Sans W6", "Yu Gothic Demibold", "YuGothic", sans-serif;
  /* color: #ce0000; */
  color: #000;
  margin-bottom: 16px;
	line-height: 1.5;
}
.head_important_ttl img {
  width: 14px;
  vertical-align: middle;
  transform: translate(0, -2px);
  margin-right: 12px;
}

.head_important_txt {
  font-size: 14px;
  line-height: 1.7;  
}
.head_important_txt a {
  color: #212121;
  transition: 0.4s cubic-bezier(0, 0, 0.4, 1);
  transition-property: color;
}
.head_important_txt a:hover {
  color: #0067de;
  transition-duration: 0.2s;
}
.head_important_ttl a,
.head_important_ttl a:visited {
  color: rgba(0, 0, 238, 1);
}


/* ----------------------------------------
  news
---------------------------------------- */
.news {
  width: 942px;
  margin: 0 auto 90px;
  position: relative;
}

.news_topics {
  margin-top: 40px;
}

.news_ttl {
  font-size: 18px;
  /* ソニーのフォントはfont-weightを使わない */
  /* font-weight: bold; */
  margin-bottom: 34px;
}

.news_indexLink {
  display: inline-block;
  font-size: 13px;
  color: #000;
  position: absolute;
  right: 0;
  top: 0;
}
.news_importantNotice .news_indexLink {
  top: 5px;
}
.news_indexLink::after {
  content: "";
  display: inline-block;
  width: 8px;
  height: 8px;
  border: 1px solid #000;
  border-width: 1px 1px 0 0;
  box-sizing: border-box;
  transform: rotate(45deg);
  transform-origin: center center;
  margin-left: 6px;
  transition: .32s cubic-bezier(0, 0, 0.4, 1);
  transition-property: border, transform;
}
.news_indexLink img {
  margin-left: 10px;
}

.news_indexLink:hover  {
  color: #0067de;
  transition-duration: 0.2s;
}

.news_indexLink:hover::after {
  border-color: #0067de;
  transform: rotate(45deg) translate(4px, -4px);
  transition-duration: .2s;
}

.news_list {
  margin-bottom: 36px;
}

.news_item a {
  display: block;
  color: #000;
}
.news_item a:hover .news_item_txt {
  color: #0067de;
  transition-duration: 0.2s;
}

.news_item_date {
  width: 136px;
  font-size: 12px;
  /* 英語文字間の調整：一度ニュートラルなのを確認 */
  /* letter-spacing: 0.02em; */
  margin-bottom: 12px;
}

.news_item_txt {
  width: calc(100% - 136px);
  font-size: 14px;
  /* 英語文字間の調整：一度ニュートラルなのを確認 */
  /* letter-spacing: 0.02em; */
  line-height: 1.5;
  margin-bottom: 28px;
  transition: 0.4s cubic-bezier(0, 0, 0.4, 1);
  transition-property: color;
  transform: translate(0, -4px);
}
.news_item_txt span {
  display: block;
  font-family: "SST W20 Roman", "SST W55 Regular", sans-serif;
  /* ソニーのフォントはfont-weightを使わない */
  /* font-weight: normal; */
  font-size: 12px;
  margin-bottom: 6px;
}

.news_important {
  width: 404px;
  height: 60px;
  margin: 0 auto;
}
.news_important a {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  color: #000;
  width: 100%;
  height: 100%;
  border: 1px solid #6c6c6c;
  transition: 0.4s cubic-bezier(0, 0, 0.4, 1);
}
.news_important a:hover {
  color: #ce0000;
  border-color: #ce0000;
}
.news_important a img {
  width: 15px;
  margin-right: 16px;
  transform: translate(0, -2px);
}

/* importantNotice */
.news_importantNotice_ttl img {
  width: 19px;
  margin-right: 15px;
  vertical-align: middle;
  transform: translate(0, -2px);
}

.news_importantNotice .news_item_txt {
  transform: translate(0, -4px);
}

/* 2021/3/19追記 */
.link_arrow{
  display: block;
}
.link_arrow em{
  font-style: normal;
}
.link_arrow::after{
  content: "";
    display: inline-block;
    vertical-align: middle;
    right: 0;
    width: 9px;
    height: 9px;
    border: 1px solid rgba(0, 0, 238, 1);
    border-width: 1px 1px 0 0;
    box-sizing: border-box;
    transform: rotate(45deg);
    transform-origin: center center;
    margin-left: 6px;
    margin-top: -2px;
    /* transition: .32s cubic-bezier(0, 0, 0.4, 1);
    transition-property: border, transform; */
}
.link_arrow:active::after{
  border: 1px solid #ce0000;
  border-width: 1px 1px 0 0;
}
/* .link_arrow:hover::after {
  transform: rotate(45deg) translate(4px, -4px);
  transition-duration: .2s;
} */
.link_arrow_sp{
   display: none;
}
.text_sym{
  position: relative;
  padding: 0 14px;
  font-style: normal;
}

.text_sym::before{
  content:"";
  width: 10px;
  height: 20px;
  position: absolute;
  left: 3px;
  top: 15%;
  background:url(../img/top_left_k.svg) no-repeat center center;
  background-size: contain;
}
.text_sym::after{
  content:"";
  width: 10px;
  height: 20px;
  position: absolute;
  right: 3px;
  top: 15%;
  background:url(../img/top_right_k.svg) no-repeat center center;
  background-size: contain;
}
.link_arrow:active .text_sym::before{
  background:url(../img/top_left_k_red.svg) no-repeat center center;
  background-size: contain;
}
.link_arrow:active .text_sym::after{
  background:url(../img/top_right_k_red.svg) no-repeat center center;
  background-size: contain;
}
@media screen and (max-width: 640px){
  .link_arrow_sp{
    display: inline;
  }
}



@media screen and (min-width: 641px) {

  #tmpl_main {
    width: 100%;
    margin: 0 auto;
  }
  
  .slider_item a:hover .ico-movieModalPlay {
    background: rgba(0, 0, 0, 0.8);
    transition: 0.6s cubic-bezier(0, 0, 0.4, 1);
    transition-property: background;
  }

  .slider_item a:hover .ico-movieModalPlay::after {
    transform: scale(1.4);
    opacity: 0;
    transition: 0.6s cubic-bezier(0, 0, 0.4, 1);
    transition-property: transform, opacity;
  }
}

/* ----------------------------------------
  SP
  breakpoint は 640px のみ
---------------------------------------- */
@media screen and (max-width: 640px) {
  #tmpl_main {
    /* padding: 0 16px; */
    box-sizing: border-box;
  }

  .sp {
    display: block;
  }
  
  .pc {
    display: none;
  }

  .head_important {
    width: 100%;
    margin: 20px auto;
    box-sizing: border-box;
    padding: 0 16px;
  }
  .head_important-disaster {
    padding-bottom: 30px;
    margin: 40px auto 40px;
  }
  
  .head_important_ttl {
    font-size: 13px;
    margin-bottom: 16px;
  }
  
  .head_important_txt {
    font-size: 14px;
    /* 英語文字間の調整：一度ニュートラルなのを確認 */
    /* letter-spacing: .08em;   */
    line-height: 1.7;  
  }

  /* ----------------------------------------
    news
  ---------------------------------------- */
  .news {
    width: 100%;
    margin-bottom: 60px;
    box-sizing: border-box;
    padding: 0 16px;
  }

  .news_ttl {
    font-size: 16px;
  }

  .news_important {
    width: 100%;
  }

  .news_item > a {
    display: block;
  }

  .news_item_date {
    font-size: 13px;
    margin-bottom: 8px;
  }

  .news_item_txt {
    width: 100%;
    margin-bottom: 20px;
  }
  .news_item_txt span {
    font-size: 10px;
  }

  .news_important a {
    font-size: 13px;
  }
  .news_important a img {
    margin-right: 8px;
  }

  .news_indexLink {
    top: 1px;
    right: 16px;
  }
  .news_importantNotice .news_indexLink {
    top: 27px;
  }

  .news_importantNotice_ttl {
    line-height: 1.444;
    padding-left: 36px;
    position: relative;
  }
  .news_importantNotice_ttl img {
    position: absolute;
    left: 0;
    top: calc(50% - 2px);
    transform: translate(0, -50%);
  }

}

.news_item .news_item_txt a:hover{
  color: #0067de;
  transition-duration: 0.2s;
}

.news_ServiceArea_11{
  width:942px ;
  margin: 0 auto;
}
@media screen and (max-width: 640px) {
 .news_ServiceArea_11{
  width: 100%;
 }
}


/***************************************
 * Modaal
 **************************************/
/*! Modaal - accessible modals - v0.4.4 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: 1000000; opacity: 0; }

.modaal-wrapper { display: block; position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 1000001; 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; }

@media only screen and (max-width: 768px) { .modaal-inner-wrapper { padding: 80px 5px; } }

.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: rgba(0, 0, 0, 0); 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: rgba(0, 0, 0, 0); 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-inner { left: 100%; margin-left: 40px; }

.modaal-gallery-next-outer { right: 45px; }

.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-gallery-prev-inner { right: 100%; margin-right: 40px; }

.modaal-gallery-prev-outer { left: 45px; }

.modaal-video-wrap { position: relative; max-width: 900px; margin: 0 auto; }

@media only screen and (max-width: 768px) { .modaal-video-wrap { max-width: 100%; } }

.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; 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 (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-width: 768px) { .modaal-image .modaal-inner-wrapper { padding-left: 5px; padding-right: 5px; } }

@media screen and (max-height: 768px) { .modaal-inner-wrapper { padding-top: 20px; padding-bottom: 20px; } }

@media screen and (max-height: 900px) { .modaal-instagram iframe { width: 500px !important; } }

@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); }

/******************************************************************
carousel-slick
******************************************************************/
.slick-wrapper { position: relative; overflow: hidden; padding-top: 5px; /* arrow */ /* pauseController */ /* dot */ }

.slick-wrapper .slick-slider { position: relative; box-sizing: border-box; user-select: none; -ms-touch-action: pan-y; touch-action: pan-y; -webkit-tap-highlight-color: transparent; }

.slick-wrapper .slick-list { position: relative; overflow: visible; display: block; margin: 0; padding: 0; }

.slick-wrapper .slick-list.dragging { cursor: pointer; cursor: hand; }

.slick-wrapper .slick-slider .slick-track, .slick-wrapper .slick-slider .slick-list { transform: translate3d(0, 0, 0); }

.slick-wrapper .slick-track { position: relative; left: 0; top: 0; display: block; margin-left: auto; margin-right: auto; }

.slick-wrapper .slick-track:before, .slick-wrapper .slick-track:after { content: ""; display: table; }

.slick-wrapper .slick-track:after { clear: both; }

.slick-wrapper .slick-loading .slick-track { visibility: hidden; }

.slick-wrapper .slick-slide { float: left; height: 100%; min-height: 1px; display: none; }

.slick-wrapper .slick-slide.slick-loading img { display: none; }

.slick-wrapper .slick-slide.dragging img { pointer-events: none; }

.slick-wrapper .slick-initialized .slick-slide { display: block; }

.slick-wrapper .slick-loading .slick-slide { visibility: hidden; }

.slick-wrapper .slick-vertical .slick-slide { display: block; height: auto; border: 1px solid transparent; }

.slick-wrapper .slick-arrow.slick-hidden { display: none; }

.slick-wrapper .slick-slider { display: none; }

.slick-wrapper .slick-slider.slick-initialized { display: block; }

.slick-wrapper .slick { display: none; }

.slick-wrapper .slick.slick-initialized { display: block; }

.slick-wrapper .slick-list { margin-left: -15px; margin-right: -15px; }

@media screen and (max-width: 640px) { .slick-wrapper .slick-list { margin-left: -8px; margin-right: -8px; } }

.slick-wrapper .slick-track { display: flex; }

.slick-wrapper .slick-slide { float: none; height: auto; width: 695px; margin-left: 15px; margin-right: 15px; }

.slick-wrapper .slick-slide:not(.slick-current) { position: relative; }

.slick-wrapper .slick-slide:not(.slick-current):before { cursor: pointer; content: ""; display: block; width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: +2; }

.slick-wrapper .slick-slide .p-carousel-slick__body { transition-property: opacity; transition-duration: 0.6s; opacity: 0; }

.slick-wrapper .slick-slide.is-active-next .p-carousel-slick__body, .slick-wrapper .slick-slide.slick-current .p-carousel-slick__body { opacity: 1; }

@media screen and (max-width: 640px) { .slick-wrapper .slick-slide { width: 75vw; } }

.slick-wrapper .slick-slide img { width: 100%; }

.slick-wrapper .slick-slide a { display: block; }

@media screen and (max-width: 640px) { .slick-wrapper .slick-slide { margin-left: 8px; margin-right: 8px; } }

.slick-wrapper .slick-initialized .slick-slide { display: flex; }

.slick-wrapper .p-carousel-slick { align-self: flex-start; flex-direction: column-reverse; }

.slick-wrapper .p-carousel-slick__img a { display: block; }

.slick-wrapper .p-carousel-slick__img a img { transition-property: opacity; transition-duration: 0.3s; }

.slick-wrapper .p-carousel-slick__img a:hover img { opacity: 0.7 !important; }

.slick-wrapper .p-carousel-slick__img a[data-modal="video"] { position: relative; }

.slick-wrapper .p-carousel-slick__img a[data-modal="video"]::before { transition-property: background; transition-duration: 0.3s; position: absolute; content: ""; margin: auto; box-sizing: border-box; vertical-align: middle; top: 0; right: 0; bottom: 0; left: 0; width: 72px; height: 72px; background: url(../img/ico-play-white.svg) left 53% center/17px auto no-repeat, rgba(0, 0, 0, 0.2); border-radius: 50%; z-index: +1; }

.slick-wrapper .p-carousel-slick__img a[data-modal="video"]::after { transition-property: background; transition-duration: 0.3s; position: absolute; content: ""; margin: auto; box-sizing: border-box; vertical-align: middle; top: 0; right: 0; bottom: 0; left: 0; width: 72px; height: 72px; background: rgba(0, 0, 0, 0.4); border-radius: 50%; }

.slick-wrapper .p-carousel-slick__img a[data-modal="video"]:hover::before { background-color: rgba(0, 0, 0, 0.8); }

.slick-wrapper .p-carousel-slick__img a[data-modal="video"]:hover::after { transition-property: all; transition-duration: 0.6s; transform: scale(1.4); opacity: 0; }

.slick-wrapper .p-carousel-slick__body { font-family: inherit; line-height: 1.4; margin: 20px 0; font-size: 15px; }

@media screen and (max-width: 640px) { .slick-wrapper .p-carousel-slick__body { font-size: 13px; margin: 15px 0 10px; } }

.slick-wrapper .p-carousel-slick__body strong { font-family: "SST W15 Bold", "SST W55 Bold", "Hiragino Sans W6", "Yu Gothic Demibold", "YuGothic", sans-serif; }

.slick-wrapper .p-carousel-slick__body a { display: block; color: inherit; transition-property: color; transition-duration: 0.3s; }

.slick-wrapper .p-carousel-slick__body a:hover { color: #0067de; }

.slick-wrapper .slider_arrowController { position: absolute; width: 695px; margin: 0 auto; left: 0; right: 0; top: 405px; }

@media screen and (max-width: 640px) { .slick-wrapper .slider_arrowController { width: 100%; } }

.slick-wrapper .slider_arrow { display: block; position: absolute; z-index: 100; cursor: pointer; padding: 5px 10px; }

.slick-wrapper .slider_arrow:hover .path { stroke: #0067de; }

.slick-wrapper .slider_arrow-prev { left: -40px; }

.slick-wrapper .slider_arrow-next { right: -40px; }

.slick-wrapper .slider_arrow svg, .slick-wrapper .slider_arrow img { width: 12px; }

.slick-wrapper .slider_containerOuter { position: relative; }

.slick-wrapper .slider_pauseController { display: flex; justify-content: flex-end; position: absolute; top: 0; right: 0; left: 0; width: 695px; margin: 0 auto; padding: 4px 0; }

@media screen and (max-width: 640px) { .slick-wrapper .slider_pauseController { width: 100%; } }

.slick-wrapper .slider_pauseController svg { display: block; width: 12px; height: 12px; padding: 11px; box-sizing: content-box; }

.slick-wrapper .slider_pauseController .slider_btn { opacity: 0.4; cursor: pointer; transition: opacity 0.4s ease; }

.slick-wrapper .slider_pauseController .slider_btn.is-active { opacity: 1; }

.slick-wrapper .slider_pauseController .slider_btn:hover { opacity: 1; }

.slick-wrapper .slider_pauseController .slider_btn:hover path, .slick-wrapper .slider_pauseController .slider_btn:hover rect { fill: #0067de; }

.slick-wrapper .slider_btn-play path { fill: #6c6c6c; }

.slick-wrapper .slider_dotContainer { position: relative; z-index: +1; display: flex; justify-content: center; flex-wrap: wrap; box-sizing: border-box; width: 559px; margin: 0 auto; padding: 4px 0; }

@media screen and (max-width: 640px) { .slick-wrapper .slider_dotContainer { width: calc(100% - 68px - 68px); } }

.slick-wrapper .slider_dot { display: block; width: 34px; height: 34px; margin: 0 4px; position: relative; border-radius: 50%; box-sizing: border-box; position: relative; transform: rotate(-90deg); cursor: pointer; }

.slick-wrapper .slider_dot::before { content: ""; display: block; width: 6px; height: 6px; background: #6c6c6c; border-radius: 50%; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); transition: 0.2s ease; transition-property: background; }

.slick-wrapper .slider_dot:hover::before { background: #0067de; }

.slick-wrapper .slider_dot svg { position: absolute; left: 0; top: 0; }

.slick-wrapper .slider_dot circle { opacity: 0; transform: scale(0.88); transform-origin: center center; fill: transparent; stroke: #c9c9c9; stroke-width: 1px; transition: 0.25s cubic-bezier(0, 0, 0.4, 1); transition-property: transform, opacity; }

.slick-wrapper .slider_dot.is-current circle { opacity: 1; transform: scale(1); transition-duration: 0.6s; }

.slick-wrapper .slider_dot .move { position: relative; z-index: 10; }

.slick-wrapper .slider_dot .move_circle { stroke: #000; stroke-width: 1px; box-sizing: border-box; stroke-dasharray: 0 100.48; }

.slick-wrapper .slider_dot.is-current::before { background: #000; }
