@charset "UTF-8";
/* CSS Document */


/* スマートフォン用CSS */


html, body {
	width: 100%;
	min-height: 100vh;
	color: #fff;
	background: #f1e4d3;
	font-size: 13px;
	line-height: 1.6;
	letter-spacing: 0.01em;
	font-family: "proxima-sera" , "a-otf-ryumin-pr6n", serif;
	font-weight: 300;
	font-style: normal;
	overflow-x: hidden;
	background: rgb(6,46,67);
	background: linear-gradient(130deg, rgba(6,46,67,1) 0%, rgba(48,103,99,1) 90%, rgba(173,167,155,1) 100%);
}


.pc{display: none!important;}

header{
	position: fixed;
	top: 0;
	left: 50%;
	transform: translateX(-50%);
	width: 90%;
	max-width: 2208px;
	padding-top: 3em;
	pointer-events: none;
	z-index: 2;
}

header .logo{
	pointer-events: visible;
	position: relative;	
}

header .logo .logo-l{
	display: block;
	max-width: 110px;
	transition: opacity 1s ease 1s;
	position: absolute;
	top: 0;
}

header .logo .logo-s{
	display: block;
	max-width: 70px;
	transition: opacity .6s ease 0s;
	opacity: 0;
	position: absolute;
	top: 0;
	transform: translateY(-30%);
}


.scroll header .logo .logo-l{
	opacity: 0;
	transition: opacity .6s ease 0s;
}

.scroll header .logo .logo-s{
	opacity: 1;
	transition: opacity 1s ease 1s;
}

header .logo.open{
	opacity: 0;
	transition: .5s ease .5s;
}


.en{
	font-family: "a-otf-ud-reimin-pr6n", sans-serif;
	font-weight: 300;
	font-style: normal;	
}

img.num1{
	display: block;
	width: 4.4em;
}
img.num2{
	display: block;
	width: 6.33em;
}
img.num3{
	display: block;
	width: 6.133em;
}
img.num4{
	display: block;
	width: 5.266em;
}
img.num5{
	display: block;
	width: 6.6em;
}
img.num6{
	display: block;
	width: 6.8em;
}
img.num7{
	display: block;
	width: 5.2em;
}
img.num8{
	display: block;
	width: 6.4em;
}
img.num9{
	display: block;
	width: 6.8em;
}

footer{
	padding-top: 4em;
}

.fix-btn{
	display: table;
	position: fixed;
	left: 0;
	bottom: 0;
	padding: 1.1em;
	background: #a9a59a;
	z-index: 2;
	line-height: 1;
	width: 100%;
	text-align: center;
	pointer-events: none;
	opacity: 0;
	transition: opacity .3s ease;
}

.fix-btn img{
	width: 10em;
}

.fixed .fix-btn{
	opacity: 1;
	pointer-events: visible;	
}


/*
TOP
===================
*/

.int-icatch-wrap{
	height: 100vh;
	position: relative;
	margin-bottom: 12em;
}

.int-icatch-wrap:before{
	content: "";
	display: block;
	width: 22.13em;
	height: 49.4em;
	background: url(img/top/int_bg.png) no-repeat;
	background-size: contain;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50% , -50%);
}

.int-icatch-wrap .page-title{
	width: 80%;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50% , -50%);	
	line-height: 1;
}

.int-icatch-wrap .page-title span{
	display: block;
	width: 70%;
	margin-left:12%;
	padding-top: 2.4em;
}

.int-icatch-wrap .scroll{
	width: 1px;
	height: 28vh;
	background: rgba(255,255,255,0.25);
	position: absolute;
	bottom: 0;
	left: 50%;
	transform: translateX(-50%);
}

.int-icatch-wrap .scroll:before{
	content: "";
	display: block;
	width: 0.73em;
	height: 2.6em;
	background: url(img/common/scroll.svg) no-repeat;
	background-size: cover;
	position: absolute;
	top: 45%;
	left: 1.13em;
}

.int-icatch-wrap .scroll span{
	position: absolute;
	width: 100%;
	height: 100%;
	overflow: hidden;
}

.int-icatch-wrap .scroll span:after {
	content: "";
	display: block;
	width: 1px;
	height: 100%;
	background: rgba(255,255,255,0.35);
	position: absolute;
	animation: arrow-line 3s ease-in-out infinite;
}

@keyframes arrow-line {
	0%, 6% {
		transform: translateY(-28vh);
	}
	33%, 66% {
		transform: translateY(0);
	}
	94%, 100% {
		transform: translateY(28vh);
	}
}


.int-contents-wrap{
	width: 90%;
	max-width: 1980px;
	margin: 0 auto;
}

.int-contents{
	display: block;
	margin-bottom: 7em;
}

.int-thumb-wrap{
	line-height: 0;
	width: 100%;
	max-width: 1800px;
	margin:0 auto 7em;
}

.int-contents .title-wrap{
	color: #aaa69b;
	margin-bottom: 4em;
}

.int-contents .title-wrap .title{
	font-size: 1.4em;
	letter-spacing: .2em;
}

.int-contents .title-wrap .title .en{
	font-size: .41em;
	letter-spacing: .05em;
	display: block;
	color: #dcdddd;
	margin-top: .8em;
}

.int-contents .text-wrap p.jp{
	line-height: 2.4;
	margin-bottom: 6.33em;
	position: relative;
}

.int-contents .text-wrap p.jp:after{
	content: "";
	display: block;
	width: 100%;
	height: 1px;
	background: rgba(255,255,255,0.25);
	position: absolute;
	left: 0;
	bottom: -3.33em;
}

.int-contents .text-wrap p.en{
	font-size: .66em;
	letter-spacing: .05em;
	line-height: 2.6;
	color: #dcdddd;
}


/*
PAGE
====================
*/

.page-contents-wrap{
	width: 90%;
	max-width: 2208px;
	margin: 0 auto;
	padding-top: 16em;
}

.page-title{
	margin-bottom: 4.8em;
}

.s-name{
	font-style: italic;
	margin-left: .2em;
	margin-right: .3em;
}


/*
SCHEDULE
====================
*/

.page-title.schedule img{
	display: block;
	width: 36vw;
}

.page-title.schedule{
	position: relative;
	margin-bottom: 3em;
}

.page-title.schedule .scroll{
	width: 1px;
	height: 8em;
	background: rgba(255,255,255,0.25);
	position: absolute;
	bottom: -3em;
	right: 5%;
	transform: translateY(70%);
}

.page-title.schedule .scroll:before{
	content: "";
	display: block;
	width: 0.73em;
	height: 2.6em;
	background: url(img/common/scroll.svg) no-repeat;
	background-size: cover;
	position: absolute;
	top: 45%;
	left: 1.13em;
}

.page-title.schedule .scroll span{
	position: absolute;
	width: 100%;
	height: 100%;
	overflow: hidden;
}

.page-title.schedule .scroll span:after {
	content: "";
	display: block;
	width: 1px;
	height: 100%;
	background: rgba(255,255,255,0.35);
	position: absolute;
	animation: arrow-line 3s ease-in-out infinite;
}

.schedule-contents{
	color: #aaa69b;
	display: block;
}

.schedule-contents-wrap{
	margin-bottom: 10em;
}

.schedule-contents .num-wrap{
	width: 100%;
	padding: 4em 0 2em;
	position: relative;
}

.schedule-contents .num-wrap img{
	zoom: .7;
}

.schedule-contents .num-wrap:before{
	content: "";
	display: block;
	width: 100%;
	height: 1px;
	background: rgba(255,255,255,0.25);
	position: absolute;
	top: 0;
	left: 0;
}

.schedule-contents .text-wrap{
	width: 100%;
	padding: 0 0 4em;
	position: relative;
}

.schedule-contents-wrap section:last-child.schedule-contents .text-wrap:after{
	content: "";
	display: block;
	width: 100%;
	height: 1px;
	background: rgba(255,255,255,0.25);
	position: absolute;
	bottom: 0;
	left: 0;
}

.schedule-contents .text-wrap p{
	font-size: 1.1em;
	letter-spacing: .1em;
	line-height: 2.4;
}

.schedule-contents .text-wrap p span{
	font-size: .9em;
	letter-spacing: .1em;
	line-height: 2.2;
	display: inline-block;
}



/*
PROFILE
====================
*/

.page-title.profile{
	margin-bottom: 3em;
}

.page-title.profile img{
	display: block;
	width: 29vw;
}

.profile-contents{
	display: block;
}

.profile-contents .title-wrap{
	width: 100%;
	padding: 1.6em 0;
	position: relative;
}

.profile-contents .title-wrap .title{
	font-size: 1.2em;
	letter-spacing: .4em;
}

.profile-contents .title-wrap:before{
	content: "";
	display: block;
	width: 100%;
	height: 1px;
	background: rgba(255,255,255,0.25);
	position: absolute;
	top: 0;
	left: 0;
}

.profile-contents .text-wrap:before{
	content: "";
	display: block;
	width: 100%;
	height: 1px;
	background: rgba(255,255,255,0.25);
	position: absolute;
	top: 0;
	left: 0;
}

.profile-contents .name-wrap{
	line-height: 1;
	padding-top: 5.2em;
}

.name-wrap .cat{
	letter-spacing: .4em;
	margin-bottom: 2em;
}

.name-wrap .name{
	font-size: 1.5em;
	letter-spacing: .4em;
	margin-bottom: 1.66em;
}

.name-wrap .name span{
	display: inline-block;
	font-size: .6em;
	letter-spacing: .1em;
	vertical-align: middle;
	font-family: "Times New Roman";
	font-style: italic;
	margin-left: 2em;
}

.profile-text p{
	line-height: 2.4;
	letter-spacing: .05em;
}

.profile-contents .text-wrap{
	padding: 3em 0 5em;
	position: relative;
}

.profile-contents .text-wrap .jp-wrap{
	width: 100%;
	line-height: 2.4;
	letter-spacing: .1em;
	margin-bottom: 3em;
}

.profile-contents .text-wrap .en-wrap{
	width: 100%;
	font-size: .66em;
	line-height: 2.6;
	color: #dcdddd;
}

.profile-contents .text-wrap .jp-wrap.clm1{
	width: 100%;
	font-size: 0.866em;
	line-height: 2.4;
}

.profile-contents .text-wrap table{
	width: 100%;	
}

.profile-contents .text-wrap table th{
	padding-right: 2.3em;
	white-space: nowrap;
}


/*
SERVICE
====================
*/

.page-title.service{
	margin-right: calc(50% - 50vw);
	margin-left: calc(50% - 50vw);
	width: 100vw;
	border-bottom: 1px solid rgba(255,255,255,0.25);
	padding: 0 5%;
	padding-bottom: 3em;
}

.page-title.service img{
	display: block;
	width: 56vw;
}

.service-contents-wrap{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	margin-bottom: 2em;
}

.service-contents-wrap:after{
	content: "";
	display: block;
	width: 28%;
}

.title-logo{
	width: 6.4em;
	line-height: 0;
	margin-right: .1em;
	display: inline-block;
}

.title-logo img{
	display: inline-block;
	vertical-align: middle;
}

.title-logo2{
	width: 8.2em;
}

.service-contents{
	border-bottom: 1px solid rgba(255,255,255,0.25);
	padding-bottom: 5em;
	margin-bottom: 8em;
}

.service-contents .num{
	line-height: 1;
	margin-bottom: 2em;
	zoom: .7;
}

.service-contents .title{
	font-size: 1.4em;
	line-height: 2.4;
	letter-spacing: .1em;
	color: #aaa69b;
	margin-bottom: 2.4em;
}

.service-contents .text{
	line-height: 2.46;
}



/*
CONTACT
====================
*/

.page-title.contact{
	display: block;
}

.page-title.contact img{
	display: block;
	width: 37vw;
}

.page-title.contact span.title{
	display: block;
	margin-bottom: 3em;
}

.page-title.contact span.note{
	width: 100%;
	display: block;
	font-size: 1.1em;
	letter-spacing: .1em;
}

.page-title.contact span.note span{
	display: block;
	margin: 0.7em 0;
}

.form-wrap{
	margin-bottom: 10em;
	color: #aaa69b;
}

.form-wrap table{
	width: 100%;
}

.form-wrap table th{
	display: block;
	width: 100%;
	padding-bottom: 1em;
	vertical-align: middle;
}

.form-wrap table th span{
	font-size: 1.2em;
	letter-spacing: .2em;
}

.form-wrap table td{
	display: block;
	width: 100%;
	padding-bottom: 2em;
}

.form-wrap table tr:first-child th{
	padding-top: 3.66em;
	position: relative;
}

.form-wrap table tr:first-child th:after{
	content: "";
	display: block;
	width: 94%;
	height: 1px;
	background: rgba(255,255,255,0.25);
	position: absolute;
	top: 0;
	left: 0;
}


.form-wrap table tr:nth-of-type(9) td{
	padding-bottom: 3.66em;
	position: relative;
}

.form-wrap table tr:nth-of-type(9) td:after{
	content: "";
	display: block;
	width: 100%;
	height: 1px;
	background: rgba(255,255,255,0.25);
	position: absolute;
	bottom: 0;
	left: 0;
}

.form-wrap table tr:last-child td{
	padding-top: 2.4em;
	padding-bottom: 0;
}

input[type="text"],
input[type="email"],
input[type="tel"],
input[type="password"],
textarea{
	width: 100%!important;
	max-width: 738px!important;
    padding: .5em!important;
    line-height: 1.85714!important;
    letter-spacing: .1em!important;
    border: 1px solid #aaa69b!important;
    background: none!important;
    margin-top: 0!important;
    outline: none!important;
    -webkit-appearance: none!important;
    color: #FFF!important;
    border-radius: 0!important;
}

input[type="text"].size-m{
	max-width: 369px!important;
}

.form-wrap textarea{
	height: 12.6em;
}

td.size-m input[type="text"]{
	max-width: 80%;
}

input[type="submit"],
input[type="button"].confirm_button{
    -webkit-appearance: none!important;
    border: none!important;
    outline: none!important;
	cursor: pointer!important;
	transition: .2s ease-in;
	text-align: center;
	display: inline-block!important;
	width: 100%!important;
	max-width: 243px!important;
	height: 3.8em!important;
	border-radius: 50px;
	font-family: a-otf-ryumin-pr6n,serif;
	font-weight: 300;
	text-indent: -9999px;
	background: #aaa69b url(img/common/text_submit.svg) no-repeat center center;
	background-size: 30%;
	font-size: 15px;
}

.policy-wrap{
	display: block;
	margin-bottom: 10em;
}

.policy-wrap .title-wrap{
	width: 100%;
	margin-bottom: 3em;
}

.policy-wrap .title-wrap .title{
	font-size: 1.4em;
	color: #aaa69b;
	line-height: 2.4;
	letter-spacing: .2em;
}

.policy-wrap .text-wrap{
	width: 100%;
	font-size: .70em;
	letter-spacing: 0;
}

.policy-wrap .text-wrap p{
	line-height: 2.4;	
}


/* form */
.wpcf7-not-valid-tip{
    color: #f23d3d;
    font-size: 1.1em;
}

.wpcf7-response-output{
    color: #f23d3d;
    font-size: 1.1em;
    border: none!important;
    margin: 0;
    letter-spacing: .1em;
}

.wpcf7 .wpcf7-submit:disabled,
input[type="button"].disabled{
	opacity: .4;
}

.agree {
	font-size: 1.1em;
	margin-bottom: 2em;
}


/* checkbox */

.wpcf7-list-item{
	position: relative;
  padding-left: 1.8em;
}

.wpcf7-list-item-label {/*項目の色や文字サイズ*/
  cursor: pointer;
}
input[type="checkbox"] {
  position: absolute;
  opacity: 0;/*既存のチェックボックスを見えなくする*/
}
.wpcf7-list-item-label:before {/*チェックボックスの枠*/
  content: '';
  border: 1px solid #aaa69b;
  display: inline-block;
  width: 1em;
  height: 1em;
  position: absolute;
  top: 3px;
  left: 0;
  cursor: pointer;
  text-align: center;
}
input[type="checkbox"]:checked + .wpcf7-list-item-label:after {/*チェックアイコン*/
  content: "";
  display: block;
  position: absolute;
  top: 4px;
  left: 0;
  width: 1em;
  height: 1em;
  background: url(img/common/check.png) no-repeat center;
  background-size: contain;
}


/* confirm */
.page-contents-wrap.conf{
    padding-top: 33vh;
}

.conf-text {
    text-align: center;
    font-size: 1.2em;
    margin-bottom: 2em;
}

.form-wrap.conf table tr:last-child th{
	padding-top: 2.4em;
	padding-bottom: 0;
}

.form-wrap.conf table th span{
	font-size: 1em;
	letter-spacing: .2em;
}

.form-wrap.conf table td{
	color: #FFF;
}

.confirm_area input[type="button"]{
    -webkit-appearance: none!important;
    border: none!important;
    outline: none!important;
	cursor: pointer!important;
	transition: .2s ease-in;
	text-align: center;
	display: inline-block!important;
	font-family: a-otf-ryumin-pr6n,serif;
	font-weight: 300;
	font-size: 16px;
	text-decoration: underline;
	background: none!important;
	color: #aaa69b;
}


/*
LOGIN
====================
*/

.page-title.login{
	border-bottom: 1px solid rgba(255,255,255,0.25);
	padding-bottom: 2em;
	margin-bottom: 3em;
}

.page-title.login img{
	display: block;
	width: 24vw;
}

.login-wrap{
	max-width: 955px;
	margin: 0 auto 10em;
}

#wpmem_login legend, #wpmem_reg legend{
	display: none!important;
}

#wpmem_login fieldset, #wpmem_reg fieldset{
	margin: 0!important;
}

#wpmem_login input[type=checkbox],
.button_div label{
	display: none!important;
}

#wpmem_login{
	width: 100%!important;
}

.login-wrap input[type="text"],
.login-wrap input[type="password"]{
	max-width: none!important;
}

.login-wrap input[type="submit"]{
    -webkit-appearance: none!important;
    border: none!important;
    outline: none!important;
	cursor: pointer!important;
	transition: .2s ease-in;
	text-align: center;
	display: table!important;
	margin: 0 auto!important;
	width: 100%!important;
	max-width: 243px!important;
	height: 3.66em!important;
	border-radius: 50px;
	font-family: a-otf-ryumin-pr6n,serif;
	font-weight: 300;
	margin-top: 3.66em;
	text-indent: -9999px;
	background: #aaa69b url(img/common/text_login.svg) no-repeat center center;
	background-size: 30%;
}

.login-wrap .button_div{
	padding: 0!important;	
}

.login-wrap .div_text{
	margin-bottom: 1.5em!important;
}

#wpmem_login label{
	color: #FFF!important;
	font-size: .9em;
	letter-spacing: 0.1em;
	font-family: "a-otf-ryumin-pr6n", serif;
	font-weight: 300;
	display: block;
	margin-bottom: .6em;
}

.login-wrap .div_text + p + p label{
	font-size: .9em!important;
	letter-spacing: 0.04em!important;
	margin-bottom: 0!important;
}


/*
OTHER
====================
*/

.info-wrap{
	width: 100vw;
	height: 100vh;
	text-align: center;
}

.info-wrap .inner{
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50% , -50%);
}

.info-wrap .title{
	font-size: 1.33em;
	margin-bottom: 2em;
	color: #aaa69b;
}

.info-wrap p{
	color: #aaa69b;
	font-size: 1em;
	line-height: 2.2;
}

.info-wrap a{
	display: block;
	margin-top: 3em;
	text-decoration: underline;
	font-size: 1.1em;
}


/*
openmenu
====================
*/

.open-menu-btn-wrap {
  display: block;
  position: fixed;
  z-index: 100;
  width: 2.66em;
  height: 1.2em;
  top: 3em;
  right: 5%;
  cursor: pointer;
  z-index: 999;
  transition: .4s ease;
}

.open-menu-btn {
  display: block;
  border: none;
  width: 100%;
  height: 100%;
  position: relative;
}

.open-menu-btn .toggle {
  display: block;
  background: rgba(255,255,255,0.5);
  width: 100%;
  height: 1px;
  position: absolute;
  transition: all .4s ease;  
}

.open-menu-btn .toggle:nth-child(1) {
  top: 0;
}

.open-menu-btn .toggle:nth-child(2) {
  top: 50%;
  transform: translateY(-50%);
  
}

.open-menu-btn .toggle:nth-child(3) {
  bottom: 0;
  
}

.open-menu-btn:hover .toggle:nth-child(1) {
	top: 20%;
}

.open-menu-btn:hover .toggle:nth-child(2) {
	opacity: 0;
}

.open-menu-btn:hover .toggle:nth-child(3) {
	bottom: 20%;
}

.open .open-menu-btn-wrap{
	transform: scale(0.8);
	animation: btn-hover .8s ease-out 0s;
}

@keyframes btn-hover {
	0%{
	transform: scale(0.7);
	}
	100% {
	transform: scale(1);
	}
}

.open .open-menu-btn-wrap:hover{
	transform: scale(1);
}


.open .open-menu-btn .toggle:nth-child(1) {
	top: 50%;
	transform: translateY(-50%) rotate(45deg);
}

.open .open-menu-btn .toggle:nth-child(2) {
	opacity: 0;
}

.open .open-menu-btn .toggle:nth-child(3) {
	bottom: 50%;
	transform: translateY(50%) rotate(-45deg);
}


.open-menu-bg {
  width: 100vw;
  height: 0;
  position: fixed;
  background: rgba(170,166,155,0.8);
  top: 0;
  right: 0;
  transition: height .6s cubic-bezier(.77,0,.175,1);
  z-index: 998;
  pointer-events: none;
}

.open .open-menu-bg {
	height: 100vh;
	pointer-events: inherit;
	transition: height .8s cubic-bezier(.77,0,.175,1);
}

.open-menu-wrap {
  width: 100%;
  height: 100vh;
  position: fixed;
  overflow-y: scroll;
  top: 0;
  right: 0;
  z-index: 998;
  pointer-events: none;
  -ms-overflow-style: none;
  scrollbar-width: none;
}

.open-menu-wrap::-webkit-scrollbar{
  display: none;
}

.open .open-menu-wrap {
	pointer-events: visible;
}

.open-menu-nav{
	position: absolute;
	width: 90%;
	max-width: 2208px;
	padding: 3em 0 4em;
	top: 0;
	left: 50%;
	transform: translateX(-50%);
}


.open-menu-nav .logo{
	display: block;
	max-width: 110px;
	width: 15.4em;
	margin-bottom: 4em;
	opacity: 0;
	transition: .4s ease .4s;
	pointer-events: none;
}

.open .open-menu-nav .logo{
	opacity: 1;
	pointer-events: visible;
}

.open-menu-wrap .open-menu-nav ul{
	padding-left: 5vw;
}

.open-menu-wrap .open-menu-nav li {
  margin-bottom: 3em;
  opacity: 0;
  transform: translateY(80%);
  transition: opacity .4s ease 0s , transform 0s ease 1s ;
}

.open .open-menu-wrap .open-menu-nav li {
	opacity: 1;
	transform: translateY(0);
}

.open .open-menu-wrap .open-menu-nav li:nth-of-type(1){
	  transition: opacity .5s ease .45s , transform .5s ease .45s;
}
.open .open-menu-wrap .open-menu-nav li:nth-of-type(2){
	  transition: opacity .5s ease .5s , transform .5s ease .5s;
}
.open .open-menu-wrap .open-menu-nav li:nth-of-type(3){
	  transition: opacity .5s ease .55s , transform .5s ease .55s;
}
.open .open-menu-wrap .open-menu-nav li:nth-of-type(4){
	  transition: opacity .5s ease .6s , transform .5s ease .6s;
}
.open .open-menu-wrap .open-menu-nav li:nth-of-type(5){
	  transition: opacity .5s ease .65s , transform .5s ease .65s;
}
.open .open-menu-wrap .open-menu-nav li:nth-of-type(6){
	  transition: opacity .5s ease .7s , transform .5s ease .7s;
}
.open-menu-nav .logo,
.open .open-menu-wrap .open-menu-nav li{
  pointer-events: visible;	
}

.open-menu-wrap .open-menu-nav li:nth-of-type(1){
	width: 57vw;
}

.open-menu-wrap .open-menu-nav li:nth-of-type(2){
	width: 52vw;
}

.open-menu-wrap .open-menu-nav li:nth-of-type(3){
	width: 37vw;
}

.open-menu-wrap .open-menu-nav li:nth-of-type(4){
	width: 37vw;
}

.open-menu-wrap .open-menu-nav li:nth-of-type(5){
	width: 24vw;
}

.open-menu-wrap .open-menu-nav li:nth-of-type(6){
	width: 36vw;
}


.open-menu-wrap .open-menu-nav li.lock{
	position: relative;
}

.open-menu-wrap .open-menu-nav li.lock:before {
    content: "";
    display: block;
    width: 1.8vw;
    height: 6.4vw;
    background: url(img/common/icon_key.svg) no-repeat;
    background-size: cover;
    position: absolute;
    top: 0;
    left: 0;
    transform: translate(-6vw , 0%);
}