@charset "UTF-8";
@import url("colorbox.css?20190830"); 

/*---------------------------------------------
	Browser Default Initialization
  ---------------------------------------------*/

body, div, dl, dt, dd, ul, ul li, h1, h2, h3, h4, h5, h6,
pre, form, fieldset, input, textarea, p, blockquote, th, td,
section, nav, article, aside, header, address,
figure, figcaption {
	margin: 0;
	padding: 0;
}
address, caption, cite, code, dfn, em, strong, th, var {
	font-style: normal;
	font-weight: normal;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
caption, th {text-align: left;}
q::before ,q::after {content: '';}
object, embed {vertical-align: top;}
hr, legend {display: none;}
h1, h2, h3, h4, h5, h6 {
	font-size: 100%;
	font-weight: normal;
}
img, abbr, acronym, fieldset {border: 0;}
img {
	max-width: 100%;
	height: auto;
	vertical-align: bottom;
	-ms-interpolation-mode: bicubic;
}
ul li { list-style-type: none;}
*,
*:before,
*:after {
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
}
.clearfix { /zoom:1; }
.clearfix:before, .clearfix:after {
  content: "";
  display: table;
}
.clearfix:after {
  clear: both;
}
p {
	padding: 0 0 20px;
	line-height: 180%;
}
em {
	font-style:normal;
}
strong {
	font-weight: bold;
}
a {
	color:#000;
	outline: none;
	text-decoration: none;
	transition: all 0.5s ease-in-out;
	-webkit-transition: all 0.25s ease-in-out;
	-moz-transition: all 0.25s ease-in-out;
	-o-transition: all 0.25s ease-in-out;
	-ms-transition: all 0.25s ease-in-out;
}
a:active,
a:hover {
	text-decoration: none;
}
a:focus,
*:focus {
	outline:none;
}
a:hover img {
	-moz-transition: all 0.25s ease-in-out;
	-o-transition: all 0.25s ease-in-out;
	-webkit-transition: all 0.25s ease-in-out;
	transition: all 0.25s ease-in-out;
}
.go {
	font-family: 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, Osaka, 'MS PGothic', arial, helvetica, sans-serif;
}
.min {	font-family: "Sawarabi Mincho", "Times New Roman", "游明朝", YuMincho,"ヒラギノ明朝 Pr6 W6","Hiragino Mincho Pro", "HGS明朝E","メイリオ", "ＭＳ Ｐ明朝","MS PMincho",Meiryo, serif;}
.txhd {
	display:block;
	height:0;
	overflow:hidden;
	font-size:1.0rem;
	line-height:2;
}
.pc {
	display: inherit;
}
.sp {
	display: none;
}
.nodisp { display:none !important;}
.noborder { border:0px !important;}
.nobg { background:none !important;}
.blockdisp { display:block !important;}
.bold { font-weight: bold !important;}
:root *> .bold { font-weight: 700 !important;}
.clear { clear:both !important;}
.of { overflow:hidden;}
.fl{float:left !important;}
.fr{float:right !important;}
.fn{float:none !important;}
.taL {text-align:left !important;}
.taC {text-align:center !important;}
.taR {text-align:right !important;}
.nowrap { white-space:nowrap !important;}
.ind { text-indent:1em;}
.fit img { width:100%;}



/* ==========================================================================
   Global
   ========================================================================== */

html {
	font-size: 62.5%; 
	overflow-y: scroll;
	height: 100%;
}
html.ofyh {
	height:100%;
	overflow-y:hidden;
}
body {
	height: 100%;
	font-size: 1.6rem;
	font-family: 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, Osaka, 'MS PGothic', arial, helvetica, sans-serif;
 font-family: "Noto Sans JP";
	color: #000;
	background:#fff;
	text-align: left;
	-moz-text-size-adjust: 100%;
	-webkit-text-size-adjust: 100%;
	-o-text-size-adjust: 100%;
	-ms-text-size-adjust: 100%;
	text-size-adjust: 100%;
}
#wrap {
	width: 100%;
	min-height:100%;
	display:block;
	position:relative;
 overflow:hidden;
}
		@media only screen and (max-width: 1080px) {
   #wrap {
    width: 1080px;
   }
  }
  @media only screen and (max-width: 768px) {
   #wrap {
    width: 100%;
   }
  }
.front_cover {
	position: absolute;
	top: 0;
	bottom:0;
	left: 0;
	right: 0;
	width: auto;
	display: block;
	background:#fff;
	z-index: 1000;
}
/* is__start  */
body.is__start .front_cover {	-webkit-animation: front_cover__start 1s 0s both;
}
		@-webkit-keyframes front_cover__start {
			0% { display: block; opacity: 1; top: 0; }
			98% { display: block; opacity: 0; top: 0; }
   99% { display: none; opacity: 0; top: 0; }
   100% { display: none; opacity: 0; top: 100%; }
			/*99.9%,to { display: none; opacity: 0; top: 100%; }*/
		}

/* is__stop  */
body.is__stop .front_cover {
 display:none
}
.inner {
	*zoom: 1;
	margin: 0 auto;
}

.fix {
 position: fixed;
 width: 100%;
 height: 100%;
 z-index: -1;
}
.object-fit{
 object-fit: cover;
}
i {
 font-style:normal;
}

		@media only screen and (max-width: 768px) {
   a,
   a:hover {
    outline: none;
    text-decoration: none;
   }
   .pc {
    display:none !important;
   }
   .sp {
    display:inherit !important;
   }
   body {
    -webkit-text-size-adjust:100%;
    -webkit-overflow-scrolling: touch;
    min-width:inherit;
   }
   #wrap {
    width: 100%;
    min-height:100%;
    min-width:320px;
    padding:0;
   }
		}
  

/*
			header
==================================================================================  */
.hd__inner {
 width: calc((310 / 1360) * 100%); /*310px*/
 height:100vh;
 min-height:700px;
	position: absolute;
	top:0;
	left:0;
 right:0;
	bottom:0;
 padding:10px 0;
	z-index:99;
	background: #FFF;
 display: flex;
 flex-direction: column;
 justify-content: space-between;
}
.hd__toplogo {
 display: block;
 width: 65%;
 padding: 0;
 margin:16px auto 28px;
}
.hd__toplogo a {
 display:block;
}
.hd__award {
 display: block;
 width: 76.62%;
 padding: 0;
 margin:0 auto;
}
.hd__reco {
 display: block;
 width: 81.16%;
 padding: 0;
 margin:10px auto;
}
.sp-header-wrap {
	display: block;
 width:200px;
 margin:0 auto;
	position:relative;
}
.sp-header-wrap .blog {
 display:none;
}
.hd__nav {
 width:auto;
	text-align: center;
 position:relative;
 /*margin: 0 0 30px;*/
 margin: 0 0 20px;
}
.hd__nav li,
.hd__nav li:not(:last-child) {
	margin:0 0 16px;
}
.hd__nav li a {
 width:auto;
 margin:0 auto;
 font-size:1.6rem;
 font-weight:700;
 display: inline-block;
 position:relative;
 transition: none;
	-webkit-transition: none;
	-moz-transition: none;
	-o-transition: none;
	-ms-transition: none;
 cursor:pointer;
}
.hd__nav li a span {
 display: block;
}
.hd__nav li.no a {
	pointer-events: none
}
.hd__nav li.no a span {
	opacity:.3
}
.hd__menutrigger,
.hd__menutrigger::before,
.hd__under__menutrigger__txt,
.backlayer {
	display:none;
}
.hd__under {
 display: block;
 text-align: center;
}
.hd__under .sns{
 display: block;
 text-align: center;
 margin:0 auto 10px;
}
.hd__under .sns li {
 display: inline-block;
 width: 34px;
 height: 34px;
 margin:0 6px;
}
.hd__under .sns li a {
 display: block;
 width: 34px;
 height: 34px;
 padding: 7px;
 background: #5576b9;
 border-radius: 200%;
 fill: #fff;
}
.hd__under .sns li.fb a {
 background: #5576b9;
}
.hd__under .sns li.tw a {
 background:#58a8ec;
}
.hd__under .sns li.in a {
 padding:7px;
 background: -webkit-radial-gradient(32% 106%, circle cover, rgb(255, 225, 125) 0%, rgb(255, 205, 105) 10%, rgb(250, 145, 55) 28%, rgb(235, 65, 65) 42%, transparent 82%), -webkit-linear-gradient(-45deg, rgb(35, 75, 215) 12%, rgb(195, 60, 190) 58%);
 background: -moz-radial-gradient(32% 106%, circle cover, rgb(255, 225, 125) 0%, rgb(255, 205, 105) 10%, rgb(250, 145, 55) 28%, rgb(235, 65, 65) 42%, transparent 82%), -moz-linear-gradient(-45deg, rgb(35, 75, 215) 12%, rgb(195, 60, 190) 58%);
 background: -ms-radial-gradient(32% 106%, circle cover, rgb(255, 225, 125) 0%, rgb(255, 205, 105) 10%, rgb(250, 145, 55) 28%, rgb(235, 65, 65) 42%, transparent 82%), -ms-linear-gradient(-45deg, rgb(35, 75, 215) 12%, rgb(195, 60, 190) 58%);
 background: -o-radial-gradient(32% 106%, circle cover, rgb(255, 225, 125) 0%, rgb(255, 205, 105) 10%, rgb(250, 145, 55) 28%, rgb(235, 65, 65) 42%, transparent 82%), -o-linear-gradient(-45deg, rgb(35, 75, 215) 12%, rgb(195, 60, 190) 58%);
 background: radial-gradient(circle farthest-corner at 32% 106%, rgb(255, 225, 125) 0%, rgb(255, 205, 105) 10%, rgb(250, 145, 55) 28%, rgb(235, 65, 65) 42%, transparent 82%), linear-gradient(135deg, rgb(35, 75, 215) 12%, rgb(195, 60, 190) 58%);
 -webkit-animation: animation 3.5s linear infinite;
 -moz-animation: animation 3.5s linear infinite;
 -ms-animation: animation 3.5s linear infinite;
 -o-animation: animation 3.5s linear infinite;	-webkit-animation: animation 3.5s linear infinite;
}
.hd__under .sns li.blog {
 display: inline-block;
 width: 86px;
 height: auto;
 margin: 0 0 0 5px;
}
.hd__under .sns li.blog a {
 display: block;
 width: inherit;
 height: auto;
 font-size:1.2rem;
 line-height:1;
 color:#FFF;
 padding: 8px;
 border-radius: 0;
 background: #9db1b4;
 position:relative;
 top:-4px;
}
.hd__date {
 display:block;
 width:69.1%;
 margin:0 auto 5%;
}
.hd__copyright {
 display:none;
 text-align:center;
 font-size:1.0rem;
 line-height:1.2;
 color:#999;
 width:90%;
 margin: 0 auto  15px;
}
.hd__bnr__amazon {
 display:block;
 width:50%;
 margin:0 auto 20px;
}
.hd__bnr__amazon span {
 display:block;
 text-align:center;
 font-size:1.0rem;
 line-height:1.2;
 color:#999;
 margin: 5px 0 0;
}

 	@media only screen and (max-width: 1080px) {
   .hd__inner {
    width: 246px;
   }
  }
  
  @media only screen and (max-width: 768px) {
			.hd__inner {
    width: 100vw;
    height: 15.4589vw;
    min-height: 15.4589vw;
    position:fixed;
    top:0 ;
    left:0;
    right:0;
    bottom: inherit;
    padding:0;
    overflow:inherit;
    background: #fff;
    display: block;
   }
   .hd__top {
    position:absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    right:0;
    display: block;
    text-align: center;
    width: 29.95vw;
    z-index:1000;
   }
   .hd__toplogo {
    display: block;
    width: 29.95vw;
    padding: 0;
    margin:0;
    z-index:1000;
   }
   .hd__toplogo a {
    display:block;
   }
   .hd__award,
   .hd__reco {
    display: none;
   }
   .sp-header-wrap {
    display:none;
    width:auto;
    z-index:999;
    position:relative;
    -webkit-overflow-scrolling: touch;
   }
   .sp-header-wrap.is__open {
    display:block;	-webkit-animation: sphd__wrap__start 1.4s both;
   }
     @-webkit-keyframes sphd__wrap__start {
      0% {
       opacity: 0;
      }
   100% {
       opacity: 1;
      }
     }
    
   .hd__nav {
    width:auto;
    height: calc( 100vh - 15.4589vw );
    overflow-y: auto;
    margin-top: 15.4589vw;
    padding: 20vw 0 20vw;
    text-align: center;
    position:relative;
   }
   .hd__nav li,
   .hd__nav li:not(:last-child) {
    position: relative;
    display:block;
    margin:0 0 2.4vw;
   }
   .hd__nav li a {
    width:auto;
    height: auto;
    margin:0 auto;
    background: none;
   }
   .hd__nav li a span {
    position: relative;
    display: block;
    font-size:4.8vw;
    font-weight:bold;
    letter-spacing:0.2em;
    width: auto;
    padding: 2vw;
    margin:0 auto;
   }
   .hd__nav li.home a,
   .hd__nav li.news a,
   .hd__nav li.intro a,
   .hd__nav li.story a,
   .hd__nav li.cast a,
   .hd__nav li.staff a,
   .hd__nav li.pn a,
   .hd__nav li.theaters a,
   .hd__nav li.comment a,
   .hd__nav li.movie a,
   .hd__nav li.tieup a { width: auto;}
   .hd__nav li a.no {
    pointer-events: none
   }
   .hd__nav li a.no span {
    opacity:.3
   }
   .hd__nav li.home {
    display:none;
   }
   .hd__menutrigger {
    display: block;
    position: fixed;
    left: 1.2vw;
    top: 2vw;
    z-index: 10000;
    cursor: pointer
   }
   .hd__menutrigger::before {
    content:"";
    display: block;
    position: absolute;
    top:0;
    left:0;
    right:0;
    bottom:0;
    background:#ed5c1a;
    border-radius:200%;
    -webkit-transition: all 0.5s ease 0s;
    transition: all 0.5s ease 0s;
    z-index:-1;
   }
   .hd__menutrigger:hover::before {
    -webkit-transform: scale(1, 1);
    transform: scale(1, 1);
   }
   .hd__menutrigger-inner {
    position: relative;
    width: 11vw;
    height: 11vw
   }
   .hd__menutrigger span {
    transition: 0.3s;
    width: 7.2vw;
    height: 1px;
    background: #fff;
    display: block;
    position: absolute;
    left: 1.9vw
   }
   .hd__menutrigger span.hd__menutrigger__line01 {
    top: 3.9vw
   }
   .hd__menutrigger span.hd__menutrigger__line02 {
    top: 5.5vw
   }
   .hd__menutrigger span.hd__menutrigger__line03 {
    top: 7.1vw
   }
   .hd__menutrigger.is__active span.hd__menutrigger__line01 {
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    left: 2vw;
    top: 5.5vw;
    height: 1px;
   }
   .hd__menutrigger.is__active span.hd__menutrigger__line02 {
    opacity:0;
   }
   .hd__menutrigger.is__active span.hd__menutrigger__line03 {
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    left: 2vw;
    top: 5.5vw;
    height: 1px;
   }
   .backlayer {
    display:none;
    width: 100vw;
    height: 100vh;
    top: 0;
    position: fixed;
    overflow-y:auto;
    z-index: 998;
    background:#fff;
   }
   .backlayer.is__open {
    display:block;	-webkit-animation: backlayer__open__start 0.4s both;
   }
     @-webkit-keyframes backlayer__open__start {
      0% {
       opacity: 0;
       -webkit-transform: scale3D(.9,.9,1);
         -moz-transform: scale3D(.9,.9,1);
          -ms-transform: scale3D(.9,.9,1);
           -o-transform: scale3D(.9,.9,1);
              transform: scale3D(.9,.9,1);
      }
   100% {
       opacity: 1;
      -webkit-transition: all .5s cubic-bezier(0, .40, 0, 1) .1s;
         -moz-transition: all .5s cubic-bezier(0, .40, 0, 1) .1s;
          -ms-transition: all .5s cubic-bezier(0, .40, 0, 1) .1s;
           -o-transition: all .5s cubic-bezier(0, .40, 0, 1) .1s;
              transition: all .5s cubic-bezier(0, .40, 0, 1) .1s;
      }
     }
   .backlayer.is__close {
    display:block;	-webkit-animation: backlayer__close__start 0.4s both;
   }
     @-webkit-keyframes backlayer__close__start {
      0% {
       opacity: 1;
       -webkit-transition: all .5s cubic-bezier(0, .40, 0, 1) .1s;
          -moz-transition: all .5s cubic-bezier(0, .40, 0, 1) .1s;
           -ms-transition: all .5s cubic-bezier(0, .40, 0, 1) .1s;
            -o-transition: all .5s cubic-bezier(0, .40, 0, 1) .1s;
               transition: all .5s cubic-bezier(0, .40, 0, 1) .1s;
      }
   100% {
       opacity: 0;
       -webkit-transform: scale3D(.9,.9,1);
         -moz-transform: scale3D(.9,.9,1);
          -ms-transform: scale3D(.9,.9,1);
           -o-transform: scale3D(.9,.9,1);
              transform: scale3D(.9,.9,1);
              
      }
     }
   .hd__under {
    position:absolute;
    top: 4.2vw;
    right:2vw;
    bottom: inherit;
    left: auto;
    display: inline-block;
    text-align:center;
    width: auto;
    z-index:3;
   }
   .hd__under .sns{
    display: block;
    text-align: center;
    margin:0;
   }
   .hd__inner .sns li {
    display: inline-block;
    width: 7vw;
    height: 7vw;
    margin: 0 0 0 2vw;
   }
   .hd__inner .sns li a {
    display: block;
    width: 7vw;
    height: 7vw;
    padding: 0.8vw 1.5vw;
    font-size:4.37vw;
    fill:#fff;
    background: none;
   }
   .hd__inner .sns li.in a {
    padding: 0.8vw 1.4vw;
   }
   .hd__under .sns li.blog,
   .hd__date,
   .hd__mvtkbnr,
   .hd__copyright,
   .hd__bnr__amazon {
    display: none;
   }
  }

/* cont
================================================================================== */
.cont {
 overflow:hidden;
 position:relative;
 margin-left: calc((310 / 1360) * 100%);
}

		@media only screen and (max-width: 1080px) {
   .cont {
    margin-left: 246px;
   }
  }
  @media only screen and (max-width: 768px) {
   .cont {
    margin-left:0;
   }
  }

 
/* footer
================================================================================== */

#footer{
	display: block;
	position: absolute;
 bottom:0;
 left: calc((310 / 1360) * 100%);
 right:0;
	width: auto;
 padding: 30px 0;
}
#footer:after {
	content: "";
	display: table;
	clear: both;
}
#footer .logo {
 width:244px;
 margin:0 auto 10px; 
}
#footer .logo a {
 display:block;
 width:244px;
 height:51px;
 background: url(../img/common/logo_s.png) no-repeat 50% 50%;
 background-size: contain;
}
#footer .copyright {
 color:#afafaf;
 font-size:10px;
 text-align:center;
 max-width: calc(100% - 200px);
 margin:0 auto;
}
#footer #pageTop {
 position: absolute;
	display:block;
 bottom: 0;
 right:20px;
	width: 48px;
 height: 48px;
 z-index:4;
}
#footer #pageTop a {
	display:block;
	width: 48px;
 height: 0;
 padding:48px 0 0;
 background: rgba(0,0,0,.2)  url(../img/common/svg_ar_up.svg) no-repeat 50% 50%;
 background-size: 40% auto;
 font-size:10px;
 line-height:2;
 overflow:hidden;
}
#footer #pageTop a:hover {
 background-color: rgba(0,0,0,.6) !important;
}

		@media only screen and (max-width: 768px) {
			#footer{
    display: block;
    position: relative;
    bottom: inherit;
    left: inherit;
    right: inherit;
    width: auto;
    margin-left:0;
    padding: 10vw 4vw 15vw;
   }
   #footer:after {
    content: "";
    display: table;
    clear: both;
   }
   #footer .logo {
    width:50vw;
    margin:0 auto 5vw; 
   }
   #footer .logo a {
    width:50vw;
    height: 12vw;
   }
   #footer .copyright {
    display:block;
    line-height:1.3;
    text-align: left;
    width: auto;
    max-width:inherit;
    margin:0 13vw 0 0;
   }
   #footer #pageTop {
    position:absolute;
    bottom: 14vw;
    right: 1vw;
    width: 12vw;
    height: 12vw;
   }
   #footer #pageTop a {
    width: 12vw;
    padding:12vw 0 0;
    background: rgba(0,0,0,.2)  url(../img/common/svg_ar_up.svg) no-repeat 50% 50%;
    background-size: 40% auto;
   }
   #footer #pageTop a:hover {
    background-color: rgba(0,0,0,.2) !important;
   }
   #footer #pageTop a.touch {
    background-color: rgba(0,0,0,.6) !important;
   }
  }
  
  



/*
 movieModal
==================================================================================*/
#cboxTopCenter {
	height:10px;
}
#cboxClose{
	right: -24px;
	top: -24px;
	width:48px;
	height:48px;
	background:#ed5c1a url(../img/common/svg_close.svg) no-repeat 50% 50%;
	background-size: auto 24px;
 border-radius:200%;
	z-index:10000;
	transition: transform 0.3s ease-out;
}
#cboxClose:hover{
 background:#ed5c1a url(../img/common/svg_close.svg) no-repeat 50% 50%;
	background-size: auto 24px;
	transform: rotate(90deg);
}
.moviex{
	padding: 0 0 0px;
	clear:both;
	overflow:hidden;
	height: 100%;
}
.moviex .modal_logo {
 position:fixed;
 top:10px;
 left:10px;
 width:100px;
 opacity:.3;
}
div.player{
	width: 100%;
 /*height: 100%;*/
	height: calc(100% - 60px);
	margin:0 auto 0px;
}
.cs_box {
	width:100%;
	height:100%;
	background:#444;
	position:relative
}
.cs_box p {
	display:block;
	position:absolute;
	top:50%;
	left:0;
	right:0;
	transform: translate(0,-50%);
	color:#FFF;
	font-size:1.5714vw;
	font-family:  Helvetica, Arial, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", sans-serif;
	letter-spacing:0.4em;
	text-align:center;
}
.movie_box_tb {
	display:none
}
#nav-trailer{
	display: block;
	width:100%;
	padding:5px 0;
	text-align:center;
 height:50px;
 background:#000;
}
#nav-trailer div {
	display: inline-block;
	width: 33%;
	padding:0 2px;
 height:40px;
}
#nav-trailer div a {
 position:relative;
}
#nav-trailer div a.sin{
	display: block;
	color: rgba(255,255,255,.7);
	font-size:1.45rem;
	letter-spacing:0.05em;
	text-align: center;
	text-decoration: none;
	background:#4d3423;
 line-height:40px;
	height:40px;
}
#nav-trailer div a.dbl{
	display: block;
	color:#fff;
	text-align: center;
	text-decoration: none;
	background:#4d3423;
	height:40px;
}
#nav-trailer div a em{
 display: inline;
	font-size: 1.2rem;
	font-style:normal;
 line-height:1.3;
 padding:6px 0 0;
}
#nav-trailer div.no a{
	pointer-events: none;
	color:#999;
	background:#444;
}
#nav-trailer div a:hover{
	color:#FFF;
 background:#93603c;
}
#nav-trailer div.cur a,
#nav-trailer div.cur a:hover {
 color:#FFF;
	background:#93603c;
	cursor:default;
}

@media only screen and (max-width: 1100px) {
#colorbox,
#cboxWrapper,
#cboxContent,
#cboxLoadedContent {
 min-width:1000px !important;
}
}



/*
			LOADING
==================================================================================  */

.loadingWrap{
 width: 100%;
 height: 100%;
 position: fixed;
 top: 0;
 left: 0;
	z-index:999998;
	margin:0px;
	padding:0px;
}
.loadingWrapWaku{
 width: 100%;
 height: 100%;
 background:#f5b9bb;
 position: relative;
 margin:0px;
 padding:0px;
}

@-webkit-keyframes lds-dual-ring {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
  }
   100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@-webkit-keyframes lds-dual-ring {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
  }
   100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
.lds-dual-ring {
	width: 140px;
	height: 140px;
	margin:0px;
	padding:0px;
	position:absolute;
	top: 50%;
	left: 50%;
 transform:translate(-50%, -50%);
}
.lds-dual-ring div {
	position: absolute;
	width: 100%;
	height: 100%;
	border-radius: 50%;
	border: 1px solid #cbb06f;
	box-sizing:border-box;
	border-color: #cbb06f transparent #cbb06f transparent;
	-webkit-animation: lds-dual-ring 2s linear infinite;	-webkit-animation: lds-dual-ring 2s linear infinite;
}
				@media only screen and (max-width: 768px) {
     .lds-dual-ring {
      width: 16vw;
      height: 16vw;
     }
    }
   




/* animation 
================================================================================== */
  
._mo,._mu,_mr,._op { opacity:0; }
._mo.on {	-webkit-animation: _mo__start 1.5s 0s ease both; }
._mu.on {	-webkit-animation: _mu__start 1.5s 0s ease both; }
._mr.on {	-webkit-animation: _mr__start 1s 1s ease both; }
._op.on {	-webkit-animation: _op__start 1s 1.5s ease-out both; }

		@-webkit-keyframes _mo__start {
			0% { opacity:0; transform: translate(0,-80px);}
   100% { opacity:1; transform: translate(0,0);}
		}
  @-webkit-keyframes _mu__start {
			0% { opacity:0; transform: translate(0,150px);}
   100% { opacity:1; transform: translate(0,0);}
		}
  @-webkit-keyframes _mr__start {
			0% { opacity:0; transform: translate(150px,0);}
   100% { opacity:1; transform: translate(0,0);}
		}
  @-webkit-keyframes _op__start {
			0% { opacity:0;}
   100% { opacity:1;}
		}