@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@500;600&family=Noto+Sans+JP:wght@400;500;700&family=Noto+Serif+JP:wght@400;500;700&display=swap');
html{height: 100%;font-size: 62.5%;-webkit-text-size-adjust: 100%; -moz-text-size-adjust: 100%; -ms-text-size-adjust: 100%;}
body {height: 100%;font-family:'Noto Sans JP','ヒラギノ角ゴシック',YuGothic,'Yu Gothic','メイリオ', Meiryo,'ＭＳ Ｐゴシック','MS PGothic',sans-serif;font-size: 1.6rem;line-height: 1.7;margin:0;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;}
abbr[title]{border-bottom:1px dotted}
b,strong{font-weight:bold}
blockquote{margin:1em 40px}
code,kbd,pre,samp{font-family:monospace,serif;font-size:1em}
pre{white-space:pre;white-space:pre-wrap;word-wrap:break-word}
q{quotes:none}q:before,q:after{content:'';content:none}
sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}
sup{top:-0.5em}
sub{bottom:-0.25em}
l,menu,ol,ul{margin:1em 0}
dd{margin:0 0 0 40px}
menu,ol,ul{padding:0 0 0 40px;list-style: none;}
nav ul,nav ol{list-style:none;list-style-image:none}
img{max-width: 100%;height: auto;vertical-align: middle;border:0;-ms-interpolation-mode:bicubic}
svg:not(:root){overflow:hidden}
table{border-collapse:collapse;border-spacing:0}i{font-style: normal}
h1,h2,h3,h4,h5,h6,p,dl,dt,dd,ol,ul,li{font-weight: 400;margin:0;padding:0;letter-spacing: 1px;}
a{color:#000;text-decoration: none;-webkit-transition: all .35s ease-out;transition: all .35s ease-out;-webkit-tap-highlight-color:rgba(245,242,239,.35);}
a:active,a:hover{outline:0}
a:focus{outline:none;}
::-moz-selection {background: #000;color: #fff;}
::selection {background: #000;color: #fff;}
::-webkit-input-placeholder {color:#ccc;}
::-moz-placeholder {color:#ccc;}
header {padding-top: 5rem;height: 100%;position: relative;box-sizing: border-box;}
.header-logo {width: 115px;position:absolute;top:1rem;left:50%;-webkit-transform: translateX(-50%);transform: translateX(-50%);}
.header-wrap {padding-top: 10vh;height: 100%;background-image:url(/client_info/ATAROMA/view_preview/userweb/ext/one-plus/img/LP_OnePlus_top.jpg);background-repeat: no-repeat;background-position: left 55% center;background-size: cover;box-sizing: border-box;}
.header-heading {width: 92.5%;margin: 0 auto;}
.header-sub {width: 80%;margin: 1rem auto 0;}
.header-scroll {position: absolute;bottom: 0;left: 50%;writing-mode: vertical-rl;-webkit-writing-mode: vertical-rl;transition: all .35s ease-out;opacity: 0;}
.js-header-scroll {opacity: 1;}
.header-scroll--line {width: 1px;height: 60px;position: absolute;bottom: 0;left: 50%;overflow: hidden;transition: all .85s ease-out;}
.header-scroll--line:after{content:"";width: 100%;background: #fff;display: block;animation:scroll 1.5s ease infinite normal;overflow: hidden;}
@keyframes scroll{
	0%{
		height: 0;
	}
	50%{
		height: 60px;
		margin-top: 0;
	}
	100%{
		margin-top: 60px;				
		height: 60px;
	}
}
@media (min-width: 768px) {
.header-heading {width: 82.5%;}
.header-sub {width: 50%;}
}

@media (min-width: 1024px) {
.sp {display:none;}
header {padding: 5rem;height: 100%;position: relative;box-sizing: border-box;}
.header-wrap {background-position: center bottom;}
.header-heading {max-width: 810px;}
.header-sub {max-width: 510px;}
.header-scroll {bottom: 5rem;}
}

footer {padding: 3rem 1.5rem;background: #9B9B9B;}
.footer-wrap {max-width: 1200px;margin: 0 auto;position: relative;}
.footer-logo {width: 115px;margin: 0 auto;}
.footer-nav {text-align: center;margin: 2rem 0 3.5rem;}
.footer-nav li {font-size: 1.1rem;margin: 0 .5rem;display: inline-block;}
.footer-nav li a {color:#fff;}
.copy {font-size: 1.1rem;color:#fff;text-align: center;}
@media (min-width: 1024px) {
.footer-logo {margin: 0;position: absolute;top:-.5rem;left:0;}
.footer-nav {position: absolute;top:-.5rem;left:150px;margin: 0;}
.footer-nav li {font-size: 1.3rem;line-height: 1;margin: 0;padding: 0 1.5rem;}
.footer-nav li + li {border-left: 1px solid #fff;}
.footer-nav li a:hover {color:#2e2e2e;}
.copy {font-size: 1.2rem;text-align: right;}
}

main {display: block;color:#2e2e2e;}
.welcome {padding: 8rem 1.5rem;overflow: hidden;position: relative;}
.welcome-heading {width: 80%;}
.welcome-img {margin:4rem -1.5rem 4rem 0;padding-left: 5vw;position: relative;}
.welcome-img:after {content:"";width: 110%;height: 90%;background:#eee;position: absolute;bottom:-4rem;right:0;z-index: -1;}

@media screen and (min-width: 320px) and (max-width: 1023px) {
.welcome-heading--c {margin: 0 auto;}
}

@media (min-width: 1024px) {
.welcome {padding: 10rem 1.5rem 15rem;}
.welcome-heading {width: 35%;position: absolute;top:8rem;left:5rem;z-index: 2;}
.welcome-img {margin:0 -1.5rem 6rem 0;padding-left: 42vw;position: relative;}
.welcome-img:after {width: 65%;height: 68.5%;bottom:-6rem;right:10vw;}
}
.voice {padding: 8rem 1.5rem;background: #eee;}
.voice-heading {width: 55%;margin: -13rem auto 0;}
.voice-wrap {margin-top: 4rem;position: relative;}
.voice-img {width: 75%;}
.voice-img img {width: 100%;}
.voice-inner {margin-top: -8rem;padding: 12rem 2rem 2rem;background: #fff;}
.voice-inner__heading {font-size: 2.1rem; font-weight: 500;margin-bottom: 1.5rem;padding-left:2.2rem;position: relative;}
.voice-inner__heading:before {content:"“"; font-size: 4rem;line-height: 4rem; font-weight: 700;position:absolute;top:0;left:0;}
.voice-inner__heading:after {content:"”"; font-size: 4rem;line-height: 4rem; font-weight: 700;position:absolute;bottom:-1.5rem;right:auto;}
.voice-inner__txt {font-size: 1.5rem;}
.voice-inner__credit {color:#ababab;text-align: right;margin-top: 2.5rem;}
.voice-inner__credit span {font-size: 1.4rem;display: inline-block;position: relative;}
.voice-inner__credit span:before {content:""; width: 40px;height: 1px;background:#ababab;position: absolute;top:50%;left:-50px;}
.salon-add {font-size: 1.1rem;}
@media screen and (min-width: 320px) and (max-width: 1023px) {
.hero-main h1 { width: 100%; text-align: center; left: 0;}
.voice-img--l {margin: 0 0 0 -1.5rem;}
.voice-img--r {margin: 0 -1.5rem 0 auto;}
.voice-inner__tt {padding: 1rem;background: rgba(255,255,255,.85);position: absolute;top:4rem;}
.voice-inner__tt--1 {max-width: 210px;right:0;}
.voice-inner__tt--2 {max-width: 112px;left:0;}
.voice-inner__tt--3 {max-width: 110px;right:0;}
.voice-inner__heading br {display: none;}
}

@media (min-width: 1024px) {
.voice {padding: 12rem 1.5rem;}
.voice-heading {width: 270px;margin: -20rem auto 0;}
.voice-wrap {margin-top: 8rem;padding: 0 5vw;display: flex;display:-webkit-flexbox;display:-ms-flexbox;}
.voice-wrap:nth-child(odd) {flex-direction: row-reverse;}
.voice-img {width: 50%;}
.voice-inner {width: 50%;margin-top: 15rem;padding: 5rem;box-sizing: border-box;position: relative;}
.voice-inner__tt {position: absolute;top:-7rem;}
.voice-inner__tt--1 {max-width: 339px;right:0;}
.voice-inner__tt--2 {max-width: 190px;left:0;}
.voice-inner__tt--3 {max-width: 194px;right:0;}
.voice-inner__heading {font-size: 2.8rem;margin-bottom: 2rem;padding-left:3rem;}
.voice-inner__heading:before {content:"“"; font-size: 5rem;line-height: 5rem; font-weight: 700;position:absolute;top:0;left:0;}
.voice-inner__heading:after {content:"”"; font-size: 5rem;line-height: 5rem; font-weight: 700;position:absolute;bottom:-2.5rem;right:auto;}
.voice-inner__txt {font-size: 1.6rem;line-height: 2;}
.voice-inner__credit span {font-size: 1.5rem;}
.salon-add {font-size: 1.2rem;}
}

.specs {max-width: 1200px;margin: 0 auto;padding: 4rem 1.5rem;}
.specs-heading {max-width: 1200px;margin: 0 auto;text-align: center;}
.specs-item {display: flex;display:-webkit-flexbox;display:-ms-flexbox;margin-top: -1.5rem;position: relative;z-index: -1;}
.specs-item li {width: 50%;}
.specs-wrap {max-width: 1000px;margin: 3rem auto;}
.specs-title {font-size: 1.8rem;font-weight: 700;line-height: 1.5;color:#9B9B9B;text-align: center;}
.item-spec {margin-top: 2rem;padding: 3rem 1.5rem;border: 1px solid #cdcec8;}
.item-spec__dl {width: 100%;padding: 2.5rem 0;border-bottom: 1px solid #cdcec8;display: table;table-layout: fixed;}
.item-spec__dl dt,.item-spec__dl dd {font-size: 1.5rem; display: table-cell;vertical-align: top;}
.item-spec__dl dt {width: 85px;}
.item-spec__dl dd {text-align: right;}
.item-spec__txt {width: 100%;font-size: 1.2rem;margin-top: 2rem;}
.piezo-wrap {max-width: 1000px;margin: 0 auto;padding: 2.5rem;background: #9B9B9B;box-sizing: border-box;}
.piezo-inner {margin-top: 0;}
.piezo-txt {font-size: 1.8rem;line-height: 1.7;color:#fff; text-align: center;}
.piezo-txt2 {font-size: 1.5rem;line-height: 1.7;color:#fff; text-align: center;}

@media screen and (min-width: 320px) and (max-width: 1023px) {
.item-spec__dl:first-child {padding-top: 0;}
}
@media (min-width: 1024px) {
.specs {padding: 6rem 1.5rem;}
.specs-heading {width: 270px;}
.specs-wrap {margin: 6rem auto;}
.specs-title {font-size: 2.4rem;letter-spacing: .75rem;}
.item-spec {margin-top: 4rem;padding: 6rem;display: flex;display:-webkit-flexbox;display:-ms-flexbox;flex-wrap: wrap;-webkit-flex-wrap: wrap;-ms-flex-wrap: wrap;}
.item-spec__dl {width: 47.5%;padding: 4rem 0 1.5rem;}
.item-spec__dl:nth-child(even) {margin-left: 5%;}
.item-spec__dl:nth-child(-n+2) {padding-top: 0;}
.item-spec__dl dt,.item-spec__dl dd {font-size: 1.6rem;}
.item-spec__dl dt {width: 125px;}
.item-spec__txt {font-size: 1.3rem;margin-top: 3rem;text-align: right;}
.piezo-wrap {padding: 3rem;display: flex;display:-webkit-flexbox;display:-ms-flexbox;}
.piezo-icon {width: 150px;text-align: center;}
.piezo-inner {margin-top: 0;-webkit-flex: 1;flex: 1;}
.piezo-txt {font-size: 3rem;}
.piezo-txt2 {font-size: 1.6rem;}
}
.hero-main {position: relative;}
.hero-main--r {margin-right: 12%;}
.hero-main--l {margin-left: 12%;}
.hero-main img {width: 100%;}
.hero-main__heading {font-size: 2.5rem; font-weight: 500; line-height: 1.5; color: #000; position: absolute; top: 20%; z-index: 9999;}

.movie {height: 35vh;background-image:url(/client_info/ATAROMA/view/userweb/ext/one_lp/assets/images/220817_LP_one_one_movie_thumb.png);background-repeat: no-repeat;background-position: center center;background-size: cover;box-sizing: border-box;position: relative; margin-bottom: 4rem;}
.play-icon {width: 80px;position:absolute;top:50%;left:50%;-webkit-transform: translate(-50% , -50%);transform: translate(-50% , -50%);}
.movie a {width: 100%;height: 100%;position: absolute;top:0;left:0;}

@media (min-width: 1024px) {
.movie {height: 550px; margin-bottom: 12rem;}
.play-icon {width: 110px;}
.movie a:hover {background: rgba(255,255,255,.35)}
}

.set-item {padding: 4rem 1.5rem;background: #fff;}
.set-item__header {max-width: 1200px;margin: 0 auto;text-align: center;}
.starter-bal {font-weight: 500;font-size: 2.2rem;color:#f493aa;margin-bottom: 2rem;padding: .5rem 2rem;background: #fff;display: inline-block;position: relative;}
.starter-bal:before {content: "";position: absolute;top: 100%;left: 50%;margin-left: -10px; border: 10px solid transparent;border-top: 10px solid #fff;}
.starter-heading {font-weight: 700;font-size: 3rem;line-height: 1.5;}
.starter-price {font-weight: 700;font-size: 3rem;line-height: 1.5;}
.starter-price--tt {font-weight: 700;font-size: 2rem;line-height: 1.5;color:#cdcec8;text-decoration: line-through;}
.starter-note {font-size: 1.2rem;line-height: 1.5;margin-top: 1.5rem;}
.starter-set {max-width: 640px;font-size: 1.5rem;line-height: 1.6;text-align: left;margin: 2.5rem auto 0;padding: 2rem 0;border-top: 1px solid #cdcec8;border-bottom: 1px solid #cdcec8;}
.set-item__wrap {max-width: 1200px;margin: 5rem auto 0;}
.set-item__wrap img {width: 100%;}
.set-item__heading {font-weight: 500;font-size: 2.8rem;line-height: 1.2;color:#cdcec8;text-align: center;position: relative;}
.set-item__heading:before {content:"";width: 100%;height: 2px;background:#cdcec8;position: absolute;top:50%;left:0;}
.set-item__heading span {padding: 0 1.5rem;background:#eee;display: inline-block;position: relative;z-index: 4;}
.item-col__block {margin-top: 3rem; border: 1px solid #cdcec8;position: relative;}
.c-inner {padding: 2rem;}
.c-inner__heading {font-size: 2.4rem;font-weight: bold;line-height: 1.6;text-align: center;color:#fff;background: #2e2e2e;margin-bottom: 2rem; padding: 1rem;}
.c-inner__heading span {font-size: 1.5rem;display: block;}
.c-inner__txt {font-size: 1.5rem;line-height: 1.7;}
.c-inner__txt--p {font-size: 1.5rem;line-height: 1.7; text-align: center;}
.scent {margin-top: 2.5rem;}
.scent-color {font-size: 1.5rem;font-weight: 700;color:#fff;padding: .5rem 2rem;display: inline-block;position: relative;}
.scent-color:before {content: "";position: absolute;top: 100%;left: 50%;margin-left: -10px; border: 10px solid transparent;}
.scent-color--w {background: #cdcec8;}
.scent-color--w:before {border-top: 10px solid #cdcec8;}
.scent-color--g {background: #565656;}
.scent-color--g:before {border-top: 10px solid #565656;}
.scent-txt {padding: 1.5rem;}
.scent-txt--w {background: #d3e1dd;}
.scent-txt--g {background: #D3D3D3;}
.scent-txt p {font-size: 1.4rem;line-height: 1.8;}
.scent-txt p span {background:linear-gradient(transparent 60%, #fff 60%);}
.material {font-size: 1.2rem;margin-top: 1.5rem;}
.recommend {margin-top: 2.5rem;padding: 2.5rem 0;border-top: 1px solid #cdcec8;border-bottom: 1px solid #cdcec8;}
.recommend-heading {font-size: 1.5rem;font-weight: 700;color:#fff;margin-bottom: 1rem;padding: .5rem 2rem;background: #333333;display: inline-block;}
.recommend-list li {font-size: 1.5rem;padding-left: 2rem;position: relative;}
.recommend-list li:before{content: '';width: 5px;height: 5px;border: 0px;border-top: solid 1px #2e2e2e; border-right: solid 1px #2e2e2e;-ms-transform: rotate(45deg); -webkit-transform: rotate(45deg);transform: rotate(45deg);position: absolute;top: 50%;left: 0; margin-top: -1px;}
.item-col__btn {margin-top: 3rem;}
.item-col__btn a {font-size: 1.5rem;font-weight: 700;color:#2e2e2e;padding: 1.5rem;text-align: center;background: #eee;border: 1px solid #cdcec8;display: block;border-radius: 50px;}
.item-col__btn2 {margin-top: 5rem;}
.item-col__btn2 a {font-size: 1.5rem;font-weight: 700;color:#2e2e2e;padding: 1.5rem;text-align: center;background: #eee;border: 1px solid #cdcec8;display: block;border-radius: 50px;}
@media screen and (min-width: 320px) and (max-width: 1023px) {
.starter-set span {margin-bottom: .5rem;padding: .25rem 1rem;background: #fff;display: inline-block;}
}
@media (min-width: 1024px) {
.set-item {padding: 6rem 1.5rem;}
.set-item__header br {display: none;}
.starter-bal {font-size: 3rem;letter-spacing: .35rem;}
.starter-bal:before {content: "";position: absolute;top: 100%;left: 50%;margin-left: -15px; border: 15px solid transparent;border-top: 15px solid #fff;}
.starter-heading {font-size: 4rem;}
.starter-price {font-size: 3.8rem;line-height: 1.5;}
.starter-price--tt {font-size: 2.8rem;}
.starter-note {font-size: 1.3rem;}
.starter-set {font-size: 1.6rem;text-align: center;margin-top: 3.5rem;padding: 2.5rem 0;}
.starter-set span:after {content:"：";}a
.set-item__wrap {margin-top: 8rem;}
.set-item__heading {font-size: 4.2rem;}
.set-item__heading span {padding: 0 2.5rem;}
.set-item__heading br {display: none;}
.item-col {display: flex;display:-webkit-flexbox;display:-ms-flexbox;}
.item-col__block {width: 48%;margin-top: 4.5rem;}
.item-col__block:nth-child(even) {margin-left: 4%;}
.c-inner {padding: 4rem;}
.c-inner__heading {font-size: 3.2rem;margin-bottom: 2.5rem;}
.c-inner__heading span {font-size: 1.7rem;}
.c-inner__txt {font-size: 1.6rem;line-height: 1.7;}
.scent {margin-top: 3rem;}
.scent-color {font-size: 1.6rem;}
.scent-txt {padding: 1.6rem;}
.scent-txt p {font-size: 1.5rem;}
.item-col__btn {max-width: 340px;margin: 3rem auto 0;}
.item-col__btn a {font-size: 1.6rem;}
.item-col__btn a:hover {color:#fff;background: #cdcec8;}
.item-col__btn2 {max-width: 540px;margin: 5rem auto 0;}
.item-col__btn2 a {font-size: 1.6rem;}
.item-col__btn2 a:hover {color:#fff;background: #cdcec8;}
}
.subscription-img img {width: 100%;}
.subscription-wrap {max-width: 1200px;margin: 0 auto;padding: 5rem 1.5rem 0;}
.popular-icon {width: 130px;position: absolute;top:0;left:0;}
.subscription-heading {font-weight: 500;font-size: 3.8rem;line-height: 1.2;color:#cdcec8;text-align: center;letter-spacing: .25rem;}
.subscription-txt {font-weight: 500;font-size: 1.5rem;line-height: 1.7;text-align: center;}
.subscription-new {margin-top: 3rem;padding: 5rem 3rem;border: 1px solid #cdcec8;position: relative;}
.subscription-col__block {margin-top: 3rem;padding: 5rem 3rem;border: 1px solid #cdcec8;position: relative;}
.ss-heading {font-weight: 500;font-size: 2.3rem;line-height: 1.2;text-align: center;}
.ss-heading span {font-weight: 500;font-size: 1.6rem;line-height: 1.4;text-align: center;}
.ss-sub {font-weight: 500;font-size: 1.7rem;line-height: 1.7;text-align: center;margin: 1rem 0 4rem;}
.ss-txt {font-size: 1.6rem;line-height: 2;text-align: left;}
.ss-list {width: 100%;text-align: left;margin-top: 3rem;display: table;table-layout: fixed;}
.ss-list + .ss-list {margin-top: .5rem;}
.ss-list dt,.ss-list dd {font-size: 1.4rem;padding: .45rem 0;display: table-cell;vertical-align: middle;}
.ss-list dt {width: 95px;font-weight: 700;color:#fff;text-align: center;background: #333333;}
.ss-list dd {padding-left: 1.5rem;}
.ss-btn {margin-top: 3rem;}
.ss-btn a {font-size: 1.5rem;font-weight: 700;color:#2e2e2e;padding: 1.5rem;text-align: center;background: #eee;border: 1px solid #cdcec8;display: block;border-radius: 50px;}
@media (min-width: 1024px) {
.subscription-wrap {padding: 10rem 1.5rem 0;}
.popular-icon {width: 173px;}
.subscription-heading {font-size: 6rem;}
.subscription-heading:after {width: 100px;height: 2px;margin: 3.5rem auto;}
.subscription-txt {font-size: 2.5rem;}
.subscription-col {display: flex;display:-webkit-flexbox;display:-ms-flexbox;}
.subscription-new {width: 80%;margin: 4.5rem auto 0;padding: 5rem;box-sizing: border-box;}
.subscription-col__block {width: 48%;margin-top: 4.5rem;padding: 5rem;box-sizing: border-box;}
.subscription-col__block:nth-child(even) {margin-left: 4%;}
.ss-heading {font-size: 2.8rem;}
.ss-sub {font-size: 1.8rem;margin: 2rem 0 5rem;}
.ss-txt {font-size: 1.6rem;line-height: 2;text-align: left;}
.ss-list {text-align: left;margin-top: 3rem;display: table;table-layout: fixed;}
.ss-list + .ss-list {margin-top: .5rem;}
.ss-list dt,.ss-list dd {font-size: 1.4rem;padding: .45rem 0;display: table-cell;vertical-align: middle;}
.ss-list dt {width: 95px;font-weight: 700;color:#fff;text-align: center;background: #2e2e2e;}
.ss-list dd {padding-left: 1.5rem;}
.ss-btn {max-width: 340px;margin: 4rem auto 0;}
.ss-btn a {font-size: 1.6rem;}
.ss-btn a:hover {color:#fff;background: #cdcec8;}
.ss-col {text-align: center; }
.ss-col > div {display: inline-block; }
.ss-col > div .ss-list {width: auto;}
}

/* Magnific Popup CSS */
.mfp-bg {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1042;
  overflow: hidden;
  position: fixed;
  background: #fff;
  opacity: 0.8; }

.mfp-wrap {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1043;
  position: fixed;
  outline: none !important;
  -webkit-backface-visibility: hidden; }

.mfp-container {
  text-align: center;
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  padding: 0 8px;
  box-sizing: border-box; }

.mfp-container:before {
  content: '';
  display: inline-block;
  height: 100%;
  vertical-align: middle; }

.mfp-align-top .mfp-container:before {
  display: none; }

.mfp-content {
  position: relative;
  display: inline-block;
  vertical-align: middle;
  margin: 0 auto;
  text-align: left;
  z-index: 1045; }

.mfp-inline-holder .mfp-content,
.mfp-ajax-holder .mfp-content {
  width: 100%;
  cursor: auto; }

.mfp-ajax-cur {
  cursor: progress; }

.mfp-zoom-out-cur, .mfp-zoom-out-cur .mfp-image-holder .mfp-close {
  cursor: -moz-zoom-out;
  cursor: -webkit-zoom-out;
  cursor: zoom-out; }

.mfp-zoom {
  cursor: pointer;
  cursor: -webkit-zoom-in;
  cursor: -moz-zoom-in;
  cursor: zoom-in; }

.mfp-auto-cursor .mfp-content {
  cursor: auto; }

.mfp-close,
.mfp-arrow,
.mfp-preloader,
.mfp-counter {
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none; }

.mfp-loading.mfp-figure {
  display: none; }

.mfp-hide {
  display: none !important; }

.mfp-preloader {
  color: #CCC;
  position: absolute;
  top: 50%;
  width: auto;
  text-align: center;
  margin-top: -0.8em;
  left: 8px;
  right: 8px;
  z-index: 1044; }
  .mfp-preloader a {
    color: #CCC; }
    .mfp-preloader a:hover {
      color: #FFF; }

.mfp-s-ready .mfp-preloader {
  display: none; }

.mfp-s-error .mfp-content {
  display: none; }

button.mfp-close,
button.mfp-arrow {
  overflow: visible;
  cursor: pointer;
  background: transparent;
  border: 0;
  -webkit-appearance: none;
  display: block;
  outline: none;
  padding: 0;
  z-index: 1046;
  box-shadow: none;
  touch-action: manipulation; }

button::-moz-focus-inner {
  padding: 0;
  border: 0; }

.mfp-close {
  width: 44px;
  height: 44px;
  line-height: 44px;
  position: absolute;
  right: 0;
  top: 0;
  text-decoration: none;
  text-align: center;
  opacity: 0.65;
  padding: 0 0 18px 10px;
  color: #2e2e2e;
  font-style: normal;
  font-size: 28px;
  font-family: Arial, Baskerville, monospace; }
  .mfp-close:hover,
  .mfp-close:focus {
    opacity: 1; }
  .mfp-close:active {
    top: 1px; }

.mfp-close-btn-in .mfp-close {
  color: #2e2e2e; }

.mfp-image-holder .mfp-close,
.mfp-iframe-holder .mfp-close {
  color: #2e2e2e;
  right: -6px;
  text-align: right;
  padding-right: 6px;
  width: 100%; }

.mfp-counter {
  position: absolute;
  top: 0;
  right: 0;
  color: #CCC;
  font-size: 12px;
  line-height: 18px;
  white-space: nowrap; }

.mfp-arrow {
  position: absolute;
  opacity: 0.65;
  margin: 0;
  top: 50%;
  margin-top: -55px;
  padding: 0;
  width: 90px;
  height: 110px;
  -webkit-tap-highlight-color: transparent; }
  .mfp-arrow:active {
    margin-top: -54px; }
  .mfp-arrow:hover,
  .mfp-arrow:focus {
    opacity: 1; }
  .mfp-arrow:before,
  .mfp-arrow:after {
    content: '';
    display: block;
    width: 0;
    height: 0;
    position: absolute;
    left: 0;
    top: 0;
    margin-top: 35px;
    margin-left: 35px;
    border: medium inset transparent; }
  .mfp-arrow:after {
    border-top-width: 13px;
    border-bottom-width: 13px;
    top: 8px; }
  .mfp-arrow:before {
    border-top-width: 21px;
    border-bottom-width: 21px;
    opacity: 0.7; }

.mfp-arrow-left {
  left: 0; }
  .mfp-arrow-left:after {
    border-right: 17px solid #FFF;
    margin-left: 31px; }
  .mfp-arrow-left:before {
    margin-left: 25px;
    border-right: 27px solid #3F3F3F; }

.mfp-arrow-right {
  right: 0; }
  .mfp-arrow-right:after {
    border-left: 17px solid #FFF;
    margin-left: 39px; }
  .mfp-arrow-right:before {
    border-left: 27px solid #3F3F3F; }

.mfp-iframe-holder {
  padding-top: 40px;
  padding-bottom: 40px; }
  .mfp-iframe-holder .mfp-content {
    line-height: 0;
    width: 100%;
    max-width: 900px; }
  .mfp-iframe-holder .mfp-close {
    top: -40px; }

.mfp-iframe-scaler {
  width: 100%;
  height: 0;
  overflow: hidden;
  padding-top: 56.25%; }
  .mfp-iframe-scaler iframe {
    position: absolute;
    display: block;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #fff;}

/* Main image in popup */
img.mfp-img {
  width: auto;
  max-width: 100%;
  height: auto;
  display: block;
  line-height: 0;
  box-sizing: border-box;
  padding: 40px 0 40px;
  margin: 0 auto; }

/* The shadow behind the image */
.mfp-figure {
  line-height: 0; }
  .mfp-figure:after {
    content: '';
    position: absolute;
    left: 0;
    top: 40px;
    bottom: 40px;
    display: block;
    right: 0;
    width: auto;
    height: auto;
    z-index: -1;
    box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
    background: #444; }
  .mfp-figure small {
    color: #BDBDBD;
    display: block;
    font-size: 12px;
    line-height: 14px; }
  .mfp-figure figure {
    margin: 0; }

.mfp-bottom-bar {
  margin-top: -36px;
  position: absolute;
  top: 100%;
  left: 0;
  width: 100%;
  cursor: auto; }

.mfp-title {
  text-align: left;
  line-height: 18px;
  color: #F3F3F3;
  word-wrap: break-word;
  padding-right: 36px; }

.mfp-image-holder .mfp-content {
  max-width: 100%; }

.mfp-gallery .mfp-image-holder .mfp-figure {
  cursor: pointer; }

@media screen and (max-width: 800px) and (orientation: landscape), screen and (max-height: 300px) {
  /**
       * Remove all paddings around the image on small screen
       */
  .mfp-img-mobile .mfp-image-holder {
    padding-left: 0;
    padding-right: 0; }
  .mfp-img-mobile img.mfp-img {
    padding: 0; }
  .mfp-img-mobile .mfp-figure:after {
    top: 0;
    bottom: 0; }
  .mfp-img-mobile .mfp-figure small {
    display: inline;
    margin-left: 5px; }
  .mfp-img-mobile .mfp-bottom-bar {
    background: rgba(0, 0, 0, 0.6);
    bottom: 0;
    margin: 0;
    top: auto;
    padding: 3px 5px;
    position: fixed;
    box-sizing: border-box; }
    .mfp-img-mobile .mfp-bottom-bar:empty {
      padding: 0; }
  .mfp-img-mobile .mfp-counter {
    right: 5px;
    top: 3px; }
  .mfp-img-mobile .mfp-close {
    top: 0;
    right: 0;
    width: 35px;
    height: 35px;
    line-height: 35px;
    background: rgba(0, 0, 0, 0.6);
    position: fixed;
    text-align: center;
    padding: 0; } }

@media all and (max-width: 900px) {
  .mfp-arrow {
    -webkit-transform: scale(0.75);
    transform: scale(0.75); }
  .mfp-arrow-left {
    -webkit-transform-origin: 0;
    transform-origin: 0; }
  .mfp-arrow-right {
    -webkit-transform-origin: 100%;
    transform-origin: 100%; }
  .mfp-container {
    padding-left: 6px;
    padding-right: 6px; } }