* {
	outline: none !important;
}

body {
	font-family: 'メイリオ', 'Roboto', sans-serif;
	font-size: 16px;
}

a:hover {
	text-decoration: none;
}

blockquote {
	font-style: italic;
	border-left: 3px solid #333;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	font-family: 'Istok Web', sans-serif;
	font-weight: bold;
}

textarea {
	resize: none;
}

h1 {
	font-size: 36px;
	margin-top: 45px;
}

h2 {
	font-size: 31px;
}

pre {
	background-color: e4e4e4;
	border-radius: 10px;
}

.inner {
	border-bottom: 1px solid #f2f2f2;
}

.drescription {
	padding-top: 2.3em;
	font-family: 'Roboto Bold', sans-serif;
	font-size: 21px;
	font-weight: 700;
	letter-spacing: .5px;
}

.orange {
	color: #eb7f36;
}

.checkbox-inline,
.radio-inline {

	font-size: 15px;
	margin: 25px 0px 0px 0px;
}

.heading07 {
	position: relative;
	padding-top: 50px;
	padding-left: 60px;
	font-size: 26px;
}

.heading07 span {
	position: relative;
	z-index: 2;
}

.heading07::before {
	content: attr(data-en);
	position: absolute;
	transform: rotate(-5deg);
	top: -20px;
	left: 0;
	color: rgba(224, 66, 114, 0.6);
	font-size: 80px;
	font-weight: 400;
	font-family: luxus-brut, cursive;
	font-style: italic;
}


.fa-circle-thin:before,
.fa-check-circle:before,
.fa-check-square:before,
.fa-square-o:before {
	font-size: 25px;
	margin-right: 7px;
}

.contact {
	background-color: #f8f8f8;
	padding: 5em 0em;
}

.contact h1 {
	padding-bottom: 30px;
	font-size: 25px;
	letter-spacing: 5px;
	margin-top: 0px;
}

.contact p {
	margin-bottom: 15px;
}

.contact p.contact-desc {
	margin-bottom: 25px;
	line-height: 27px;
}

.social-contact-icon {
	background-color: #f2f3f4;
}

.fa {
	margin-right: 10px;
}

.top {
	color: #999999;
	position: absolute;
	top: 0;
	right: 15px;
}

.item1,
.item2 {
	height: 100px;
}

.item1 {
	background-color: red;
}

.item2 {
	background-color: green;
}

.form-control {
	border: none;
	box-shadow: none;
	border-bottom: 1px solid #adadad;
	border-radius: 0px;
	padding: 15px;
	height: auto;
	margin-bottom: 30px;
}

.gt {
	border: none;
	box-shadow: none;
	border-bottom: 1px solid #adadad;
	border-radius: 0px;
	background-color: #f8f8f8;
}

.icon {
	text-decoration: none;
	border-bottom: none;
	position: relative;
}

.icon:before {
	-moz-osx-font-smoothing: grayscale;
	-webkit-font-smoothing: antialiased;
	font-family: FontAwesome;
	font-style: normal;
	font-weight: normal;
	text-transform: none !important;
}

.icon>.label {
	display: none;
}

.icons {
	padding: 30px 0px 0px 30px;
}

.footer {
	padding: 30px 0px;
}

.icon.style2 {
	-moz-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out, border-color 0.2s ease-in-out;
	-webkit-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out, border-color 0.2s ease-in-out;
	-ms-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out, border-color 0.2s ease-in-out;
	transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out, border-color 0.2s ease-in-out;
	background-color: transparent;
	border: solid 4px #f2f3f4;
	border-radius: 4px;
	width: 70px;
	height: 70px;
	display: inline-block;
	text-align: center;
	line-height: 65px;
	color: inherit;
	border-radius: 100%;
}

.icon.style2:before {
	font-size: 1.4em;
	color: #ffffff;
}

.icon.style2:hover {
	border-color: #c9c9c9;
}

.icon.style2:active {
	background-color: rgba(242, 132, 158, 0.1);
}


.contact-info {

	margin-left: 38px;
	padding: 30px 0px 70px 0px;
}

.icon.style2.fa-facebook {

	background-color: #4071bb;
}

.icon.style2.fa-twitter {

	background-color: #27c7f5;
}

.icon.style2.fa-instagram {

	background-color: #3384c8;
}

.icon.style2.fa-dribbble {

	background-color: #fa1455;
}

.icon.style2.fa-google-plus {

	background-color: #ff8400;
}

.icon.style2.fa-stumbleupon {

	background-color: #85bb40;
}

.icon.style2.fa-behance {

	background-color: #183867;
}

.icon.style2.fa-linkedin {

	background-color: #465f91;
}

.icon.style2.fa-vk {

	background-color: #ff8400;
}

.icon.style2.fa-tumblr {

	background-color: #567a8c;
}

.icon.style2.fa-reddit-alien {

	background-color: #f13503;
}

.icon.style2.fa-pinterest {

	background-color: #f14603;
}

.right-color {

	color: #adadad;
}

#main {
	margin-top: 30px;
}

.btn-tobais {
	-webkit-transition: all 0.4s ease-in-out;
	-moz-transition: all 0.4s ease-in-out;
	-ms-transition: all 0.4s ease-in-out;
	-o-transition: all 0.4s ease-in-out;
	transition: all 0.4s ease-in-out;
	border-radius: 25px;
	font-size: 12px;
	color: #333;
	background-color: #ffffff;
	margin-top: 30px;
	border: 1px solid;
	padding: 10px 20px;
}

.hover-off:hover {
	color: #fff;
}

/* Header */

.header {
	padding: 5em 0 0;
}

.header .logo {
	display: block;
	border-bottom: 0;
	color: inherit;
	font-weight: 900;
	letter-spacing: 0.35em;
	margin: 0 0 2.5em 0;
	text-decoration: none;
	text-transform: uppercase;
	display: inline-block;
}

.header .logo>* {
	display: inline-block;
	vertical-align: middle;
}

.header .logo .symbol {
	margin-right: 0.65em;
}

.header .logo .symbol img {
	display: block;
	width: 3.2em;
	height: 2.5em;
}


.unordarlist {
	font-family: 'Roboto', sans-serif;
	list-style-type: square;
	font-size: bold;
	font-weight: bold;
	margin-left: -22px;
}


.img-fit {
	display: block;
	min-width: 100%;
}

.image-text {

	margin: 60px 0px;
}

.image-text-text {

	margin: 20px 0px;
}

.tiles {

	margin: 30px 0px;
}

img.img-responsive {
	margin: 15px 0px;
}

.btn-send {

	padding: 10px 30px;
	background-color: #333;
	color: #fff;
	margin-top: 30px;
}

.btn-defalt {

	background-color: #333;
	color: #fff;
	padding: 13px 40px;
	border-radius: 20px;
}

.btn-special {
	background-color: #333;
	color: #fff;
	padding: 13px 40px;
	border-radius: 20px;
}

.btn-big {
	background-color: #333;
	color: #fff;
	padding: 15px 35px;
	border-radius: 30px;
}

.btn-small {
	background-color: #333;
	color: #fff;
	padding: 7px 25px;
	border-radius: 30px;
}

.btn-fit {
	background-color: #333;
	color: #fff;
	padding: 12px 170px;
}

@media only screen and (max-width: 417px) {
	.btn-fit {
		padding: 12px 90px;
	}
}

.btn-fit-small {
	background-color: #333;
	color: #fff;
	padding: 8px 153px;
}

@media only screen and (max-width: 417px) {
	.btn-fit-small {
		padding: 8px 79px;
	}
}

.btn:hover {
	background-color: #555;
	color: #fff;
}

.btn:focus {
	background-color: #333;
	color: #fff;
	text-decoration: none;
}

.btn-fit-mid {
	padding: 12px 170px;
}

@media only screen and (max-width: 400px) {
	.btn-fit-mid {
		padding: 12px 100px;
	}
}

.btn-fit-small-mid {
	padding: 12px 153px;
}

@media only screen and (max-width: 400px) {
	.btn-fit-small-mid {
		padding: 12px 85px;
	}
}

.btn-disabled {
	background-color: #c1c1c1;
	color: #fff;
	padding: 13px 40px;
	border-radius: 20px;


}

button[disabled],
html input[disabled] {
	cursor: not-allowed;
}

.btn-disabled-white {

	color: #c1c1c1;
	padding: 13px 40px;
	border-radius: 20px;

}

.btn-action-small {
	background-color: #333;
	color: #fff;
	padding: 8px 30px;
	border-radius: 20px;
}

.btn-action-small-white {
	padding: 8px 30px;
	border-radius: 20px;
}

.btn-action-default-white {
	padding: 12px 170px;
}

@media only screen and (max-width: 400px) {
	.btn-action-default-white {
		padding: 12px 100px;
	}
}

.btn-action-small-2 {
	background-color: #333;
	color: #fff;
	padding: 9px 170px;
}

@media only screen and (max-width: 400px) {
	.btn-action-small-2 {
		padding: 12px 100px;
	}
}

.btn-action-small-white-2 {
	padding: 9px 170px;
}

@media only screen and (max-width: 400px) {
	.btn-action-small-white-2 {
		padding: 12px 100px;
	}
}

.btn-send-2 {
	padding: 18px 60px;
	background-color: #333;
	color: #fff;
	margin-top: 10px;
}


/* Menu */

.wrapper {
	-moz-transition: opacity 0.45s ease;
	-webkit-transition: opacity 0.45s ease;
	-ms-transition: opacity 0.45s ease;
	transition: opacity 0.45s ease;
	opacity: 1;
}

#menu {
	-moz-transform: translateX(22em);
	-webkit-transform: translateX(22em);
	-ms-transform: translateX(22em);
	transform: translateX(22em);
	-moz-transition: -moz-transform 0.45s ease, visibility 0.45s;
	-webkit-transition: -webkit-transform 0.45s ease, visibility 0.45s;
	-ms-transition: -ms-transform 0.45s ease, visibility 0.45s;
	transition: transform 0.45s ease, visibility 0.45s;
	position: fixed;
	top: 0;
	right: 0;
	width: 22em;
	max-width: 80%;
	height: 100%;
	-webkit-overflow-scrolling: touch;
	background: #333;
	color: #ffffff;
	cursor: default;
	visibility: hidden;
	z-index: 10002;
}

#menu>.inner {
	-moz-transition: opacity 0.45s ease;
	-webkit-transition: opacity 0.45s ease;
	-ms-transition: opacity 0.45s ease;
	transition: opacity 0.45s ease;
	-webkit-overflow-scrolling: touch;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	padding: 2.75em;
	opacity: 0;
	overflow-y: auto;
}

#menu>.inner>ul {
	list-style: none;
	margin: 0 0 1em 0;
	padding: 0;
}

#menu>.inner>h2 {
	list-style: none;
	padding-bottom: 30px;
	margin-top: 10px;
	margin-bottom: 15px;
}

#menu>.inner>ul>li {
	padding: 0;
	/* border-top: solid 1px rgba(255, 255, 255, 0.15); */
}

#menu>.inner>ul>li a {
	display: block;
	padding: 7px 0px;
	line-height: 1.5;
	border: 0;
	color: inherit;
}

#menu>.inner>ul>li:first-child {
	border-top: 0;
	margin-top: -1em;
}

#menu>.close {
	-moz-transition: opacity 0.45s ease, -moz-transform 0.45s ease;
	-webkit-transition: opacity 0.45s ease, -webkit-transform 0.45s ease;
	-ms-transition: opacity 0.45s ease, -ms-transform 0.45s ease;
	transition: opacity 0.45s ease, transform 0.45s ease;
	-moz-transform: scale(0.25) rotate(180deg);
	-webkit-transform: scale(0.25) rotate(180deg);
	-ms-transform: scale(0.25) rotate(180deg);
	transform: scale(0.25) rotate(180deg);
	-webkit-tap-highlight-color: transparent;
	display: block;
	position: absolute;
	top: 3em;
	right: 6em;
	width: 6em;
	text-indent: 6em;
	height: 3em;
	border: 0;
	font-size: 1em;
	opacity: 0;
	overflow: hidden;
	padding: 0;
	white-space: nowrap;
}

#menu>.close:before,
#menu>.close:after {
	-moz-transition: opacity 0.2s ease;
	-webkit-transition: opacity 0.2s ease;
	-ms-transition: opacity 0.2s ease;
	transition: opacity 0.2s ease;
	content: '';
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-position: center;
	background-repeat: no-repeat;
	background-size: 2em 2em;
}

#menu>.close:before {
	background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cstyle%3Eline %7B stroke-width: 8px%3B stroke: %23f2849e%3B %7D%3C/style%3E%3Cline x1='15' y1='15' x2='85' y2='85' /%3E%3Cline x1='85' y1='15' x2='15' y2='85' /%3E%3C/svg%3E");
	opacity: 0;
}

#menu>.close:after {
	background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cstyle%3Eline %7B stroke-width: 8px%3B stroke: %23585858%3B %7D%3C/style%3E%3Cline x1='15' y1='15' x2='85' y2='85' /%3E%3Cline x1='85' y1='15' x2='15' y2='85' /%3E%3C/svg%3E");
	opacity: 1;
}

#menu>.close:hover:before {
	opacity: 1;
}

#menu>.close:hover:after {
	opacity: 0;
}

@media screen and (max-width: 736px) {

	#menu {
		-moz-transform: translateX(16.5em);
		-webkit-transform: translateX(16.5em);
		-ms-transform: translateX(16.5em);
		transform: translateX(16.5em);
		width: 16.5em;
	}

	#menu>.inner {
		padding: 2.75em 1.5em;
	}

	#menu>.close {
		top: 0.5em;
		left: -4.25em;
		width: 4.25em;
		text-indent: 4.25em;
	}

	#menu>.close:before,
	#menu>.close:after {
		background-size: 1.5em 1.5em;
	}

}

body.is-menu-visible #wrapper {
	-moz-pointer-events: none;
	-webkit-pointer-events: none;
	-ms-pointer-events: none;
	pointer-events: none;
	cursor: default;
	opacity: 0.25;
}

body.is-menu-visible #menu {
	-moz-transform: translateX(0);
	-webkit-transform: translateX(0);
	-ms-transform: translateX(0);
	transform: translateX(0);
	visibility: visible;
}

body.is-menu-visible #menu>* {
	opacity: 1;
}

body.is-menu-visible #menu .close {
	-moz-transform: scale(1.0) rotate(0deg);
	-webkit-transform: scale(1.0) rotate(0deg);
	-ms-transform: scale(1.0) rotate(0deg);
	transform: scale(1.0) rotate(0deg);
	opacity: 1;
}

.nav-bars {
	position: absolute;
	right: 15px;
	width: auto;
	height: auto;
	top: 15px;
	padding: 30px;
}

.nav-bars i {
	color: #000;
	font-size: 20px;
	margin-right: 0px;
}




/*---------------------------hover---------------------*/
#open-popup {
	padding: 20px
}

.white-popup {
	position: relative;
	background: #f5f5f5;
	width: auto;
	max-width: 900px;
	border-radius: 15px;
}

.a a img.img-responsive {
	opacity: 0.9;
	-webkit-transition: all 0.5s ease-in-out;
	-moz-transition: all 0.5s ease-in-out;
	-ms-transition: all 0.5s ease-in-out;
	-o-transition: all 0.5s ease-in-out;
	transition: all 0.5s ease-in-out;
}

.a a:hover img.img-responsive {
	opacity: 1;
}

.a a .img-hover {
	position: absolute;
	left: 15px;
	top: 15px;
	right: 15px;
	bottom: 15px;
	text-align: center;
	color: #fff;
	text-transform: uppercase;
	transition: all .5s ease-in-out;
	opacity: 0.8;
}

@media screen and (max-width: 768px) {
	.a a .img-hover {
		top: 0px;
		bottom: 0px;
	}
}

.a a:hover .img-hover {
	opacity: 0;
}

.a a .img-hover.glass {
	background: #ea766a;
}

.a a .img-hover.shoes-glass {
	background: #a0c4a3;
}

.a a .img-hover.hand-parts {
	background: #da9dd9;
}

.a a .img-hover.table-with-phone {
	background: #6da178;
}

.a a .img-hover.orange-shoe {
	background: #da9567;
}

.a a .img-hover.glass-shoes {
	background: #5dc6aa;
}

.a a .img-hover.girls-tops {
	background: #cab0a6;
}

.a a .img-hover.egg-arts {
	background: #ddd173;
}

.a a .img-hover .c-table {
	display: table;
	width: 100%;
	height: 100%;
}

.a a .img-hover .c-table .ct-cell {
	display: table-cell;
	vertical-align: middle;
}

.a a .img-hover .c-table .ct-cell .img-title {
	display: block;
	letter-spacing: 5px;
	transition: all 0.5s cubic-bezier(0.81, -0.14, 0.47, 1)
}

.a a:hover .img-hover .c-table .ct-cell .img-title {
	display: none;
}

/*---------------------------popup----------------------------*/
.white-popup {
	position: relative;
	background-color: #f5f5f5;
	padding: 20px 0px;
	width: auto;
	max-width: min(900px, 85vw);
	max-height: calc(100vh - 100px) !important;
	margin: 0px auto;
	display: flex;
	flex-direction: column;
	box-sizing: border-box;
	overflow: hidden !important;
	border-radius: 15px;
}

.popup-head {
	margin-top: 50px;
	margin-bottom: 35px;
	margin-left: 15px;
}

.popup-parapraph {
	padding: 0px 15px;
}

.pop-up-icon {
	padding: 20px 20px;
}

.pop-up:hover {
	border-color: #c9c9c9;
}

li.popup-socials-icons {
	padding-left: 15px;
}

.pop-up {
	-moz-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out, border-color 0.2s ease-in-out;
	-webkit-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out, border-color 0.2s ease-in-out;
	-ms-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out, border-color 0.2s ease-in-out;
	transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out, border-color 0.2s ease-in-out;
	background-color: transparent;
	border: solid 4px #ffffff;
	border-radius: 4px;
	width: 50px;
	height: 50px;
	display: inline-block;
	text-align: center;
	line-height: 45px;
	color: inherit;
	border-radius: 100%;
}

.pop-up.fa-facebook {

	background-color: #4071bb;
}

.pop-up.fa-twitter {

	background-color: #27c7f5;
}

.pop-up.fa-google-plus {

	background-color: #ff8400;
}

.pop-up.fa-pinterest {

	background-color: #f14603;
}

.icon.pop-up {
	font-size: 1.0em;
	color: #ffffff;
}

.pop-up-color {
	background-color: #fff;
}

.pop-up-color img {
	margin: 20px auto;
}

.pop-up-color .p-r-0 {
	padding-right: 0px;
}

.pop-up-color .p-l-0 {
	padding-left: 0px;
}

.pop-up-color section {
	margin-top: 250px;
}

@media screen and (max-width: 1024px) {
	.pop-up-color section {
		margin-top: 25px;
	}
}

li.social-icons {
	padding-left: 15px;
	margin-top: 20px;
	margin-bottom: 20px;
}

.social-contact {
	padding-top: 10px;
	padding-left: 0px;
	text-align: center;
}

.socials-icons a {
	width: 40px;
	height: 40px;
	border-radius: 50%;
	border: 2px solid #fff;
	/* background: #6DBEC2; */
	background-color: #49C1DC;
	float: left;
	color: white;
	padding-top: 3px;
	font-size: 20px;
}

.social-contact li {
	list-style: none;
	display: inline-block;
}

.popup-social-contact {
	padding-top: 10px;
	padding-left: 0px;
	text-align: center;
}

.popup-socials-icons a {
	width: 40px;
	height: 40px;
	border-radius: 50%;
	border: 2px solid #fff;
	/* background: #6DBEC2; */
	background-color: #49C1DC;
	float: left;
	color: white;
	padding-top: 3px;
	font-size: 20px;
}

.popup-social-contact li {
	list-style: none;
	display: inline-block;
	padding-left: 6px;
}

textarea#message {
	margin-top: 35px;
}

.form-control:focus {
	border-color: #adadad;
	box-shadow: none;
}

@media screen and (max-width: 600px) {
	.mfp-arrow {
		top: 56%;
	}

	@media screen and (min-width: 601px) {
		.mfp-arrow {
			top: 40%;
		}

		.mfp-content .white-popup .col-md-4 {
			padding-right: 25px;
			padding-left: 25px;
		}

		/* モーダルコンテナの高さ制限 */
		.mfp-inline-holder .mfp-content,
		.mfp-ajax-holder .mfp-content {
			max-height: calc(100vh - 100px) !important;
			max-width: 85vw !important;
			overflow: hidden !important;
			box-sizing: border-box;
		}

		.mfp-content {
			max-height: calc(100vh - 100px) !important;
			max-width: 100% !important;
			box-sizing: border-box;
			overflow: hidden !important;
		}

		/* モーダル内のコンテナを調整 */
		.white-popup .container-fluid {
			max-height: calc(100vh - 100px) !important;
			max-width: 100% !important;
			overflow: hidden !important;
			display: flex;
			flex-direction: column;
			box-sizing: border-box;
			padding: 0;
		}

		.white-popup .pop-up-color {
			display: flex;
			flex-direction: column;
			max-height: calc(100vh - 100px) !important;
			max-width: 100% !important;
			overflow: hidden !important;
			box-sizing: border-box;
		}

		/* 画像を含むコンテナ */
		.white-popup .row {
			margin: 0;
			max-width: 100%;
			box-sizing: border-box;
			height: auto;
			max-height: calc(100vh - 100px) !important;
			display: flex;
			flex-direction: column;
			overflow: hidden !important;
		}

		.white-popup .col-sm-12 {
			box-sizing: border-box;
			padding: 10px;
			max-width: 100%;
			flex-shrink: 0;
		}

		.white-popup .col-sm-12:first-child {
			flex-shrink: 0;
			flex-grow: 0;
		}

		.white-popup .col-sm-12:last-child {
			flex: 1 1 auto;
			display: flex !important;
			align-items: center !important;
			justify-content: center !important;
			overflow: hidden !important;
			max-height: calc(100vh - 200px) !important;
			min-height: 0;
			max-width: 100%;
			width: 100%;
			padding: 5px !important;
			position: relative;
			box-sizing: border-box !important;
			height: auto !important;
		}

		/* JavaScriptで動的に設定されるため、デフォルトの高さ制限を緩和 */
		.white-popup .col-sm-12:last-child[style*="max-height"] {
			max-height: inherit !important;
		}

		/* モーダル内の画像が画面サイズに合わせて自動調整されるようにする */
		.white-popup .col-sm-12 img.img-responsive {
			max-width: 100% !important;
			max-height: 100% !important;
			width: auto !important;
			height: auto !important;
			display: block !important;
			object-fit: contain !important;
			margin: 0 auto !important;
			box-sizing: border-box !important;
			position: relative;
			vertical-align: middle;
			overflow: hidden !important;
		}

		/* JavaScriptで動的に設定されるため、デフォルトのサイズ制限を緩和 */
		.white-popup .col-sm-12 img.img-responsive[style*="max-height"] {
			max-height: inherit !important;
			max-width: inherit !important;
		}

		/* スマホとデスクトップで同じように動作 */
		@media screen and (max-width: 768px) {
			.white-popup {
				max-height: calc(100vh - 100px) !important;
				max-width: 85vw;
			}

			.white-popup .col-sm-12:last-child {
				max-height: calc(100vh - 200px) !important;
			}

			.mfp-inline-holder .mfp-content,
			.mfp-ajax-holder .mfp-content {
				max-height: calc(100vh - 100px) !important;
				max-width: 85vw !important;
			}

			.mfp-content {
				max-height: calc(100vh - 100px) !important;
				max-width: 85vw !important;
			}
		}