@charset "UTF-8";
@import url("reset.css");
/*CSS Document */
@font-face{
	font-family: "Optima", "sans-serif";
  font-style:normal;
	color:#333;
	}
@font-face {
font-family: 'Optima';
font-style: normal;
font-weight: normal;
src: local('Optima'), url('OPTIMA.woff') format('woff');
color:#333;
}
@font-face {
font-family: 'Optima Italic';
font-style: normal;
font-weight: normal;
src: local('Optima Italic'), url('Optima_Italic.woff') format('woff');
color:#333;
}
@font-face {
font-family: 'Optima Medium';
font-style: normal;
font-weight: normal;
src: local('Optima Medium'), url('Optima Medium.woff') format('woff');
color: #333;
}
@font-face {
font-family: 'Optima Bold';
font-style: normal;
font-weight: normal;
src: local('Optima Bold'), url('OPTIMA_B.woff') format('woff');
color: #333;
}
/* IE8〜11はメイリオ */
@media screen\0 {
  body {
    font-family: 'Segoe UI', /* Windowsの欧文 */
                 Meiryo,     /* メイリオ */
                 sans-serif;
  }
}


  /* #### Generated By: http://www.cufonfonts.com #### */
html{
	font-size: 62.5%;/*16px ×　62.5%=10px*/
}
body{
	font-family: "Optima", "sans-serif";
	font-size: 1.6rem;
	line-height: 1.5;
	font-feature-settings: "palt";
	letter-spacing: 0.05em;
	overflow-x: hidden;
	-webkit-text-size-adjust: 100%;
}
img{
		display:block;
		border: none;
		width: 100%;
		height: auto;
	}
	
	/* Link */
a {
	color: #525252;
	text-decoration: none;
	word-wrap: break-word;
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	transition: all  0.3s ease;
}
a:hover {
	text-decoration: underline;
}
ul { list-style-type: none;
}
/* スマホ ---------------------------------*/
@media screen and (max-width: 767px) {
	a {
		-webkit-transition: none;
		-moz-transition: none;
		-o-transition: none;
		transition: none;
	}
}
a.hoverImg01 img {
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	transition: all  0.3s ease;
}
a.hoverImg01:hover img {
	filter: alpha(opacity=70);
	-moz-opacity: 0.70;
	opacity: 0.70;
}
@media screen and (max-width: 767px) {
	a.hoverImg01:hover img {
		filter: alpha(opacity=100);
		-moz-opacity: 1;
		opacity: 1;
	}
}
/* pc sp
------------------------------------------ */
.pc {
	display: block;
}
.pcInline {
	display: inline-block;
}
.spInline,
.sp {
	display: none;
}
@media screen and (max-width: 767px) {
	.pcInline,
	.pc {
		display: none;
	}
	.sp {
		display: block;
	}
	.spInline {
		display: inline-block;
	}
}
/* #page_scroll
------------------------------------------------*/
#page_scroll{
	position: absolute;
	bottom: 0;
	right: 41px;
	width: 48px;
	height: 60px;
	z-index: 2;
}
#page_scroll.scrolled .scroll_text,
#page_scroll.scrolled .scroll_bar{
	opacity: 0;
}
#page_scroll .scroll_text {
    font-family: 'Josefin Sans', sans-serif;
    letter-spacing: 0.01em;
    font-size: 10px;
    color: #333;
    position: absolute;
    left: 50%;
    top: 0;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    transition: .2s;
}
#page_scroll .scroll_bar {
    width: 1px;
    height: 40px;
    background-color: #444;
    position: absolute;
    bottom: 0;
    left: 24px;
    transition: .2s;
}

#page_scroll .scroll_ball {
    width: 8px;
    height: 8px;
    background-color: #222;
    position: absolute;
    left: -4px;
    border-radius:4px;
    -webkit-transition: none;
    -ms-transition: none;
    transition: none;
    -webkit-animation: scroll_ball 1.2s ease-out infinite;
    animation: scroll_ball 1.2s ease-out infinite;
}
@-webkit-keyframes scroll_ball{
    0%{-webkit-transform:translateY(0px);}
100%{-webkit-transform: translateY(40px);}
}

@keyframes scroll_ball{
    0%{transform:translateY(0px);}
100%{transform: translateY(40px);}
}
/* #page_scroll
-----------------------------------------------------*/
/* #hbg */
#hbg {
	position: fixed;
	top: 50px;
	margin-top: -14px;
	right: 46px;
	z-index: 10;
}
#hbg .menuTrigger,
#hbg .menuTrigger span {
	display: inline-block;
	transition: all .4s;
	box-sizing: border-box;
	outline: none;
}
#hbg .menuTrigger {
	position: relative;
	width: 38px;
	height: 28px;
	cursor: pointer;
}
#hbg .menuTrigger span {
	position: absolute;
	left: 0;
	width: 100%;
	height: 2px;
	background-color: #000;
}
#hbg .menuTrigger span:nth-of-type(1) {
	top: 8px;
}
#hbg .menuTrigger span:nth-of-type(2) {
	bottom: 7px;
}
#hbg .menuTrigger:hover span {
	background-color: #888;
}
#hbg .menuTrigger.active span:nth-of-type(1) {
	-webkit-transform: translateY(5.5px) rotate(-45deg);
	transform: translateY(5.5px) rotate(-45deg);
}
#hbg .menuTrigger.active span:nth-of-type(2) {
	-webkit-transform: translateY(-5.5px) rotate(45deg);
	transform: translateY(-5.5px) rotate(45deg);
}
#hbg .menuTrigger:hover span {
	background-color: #888;
}
#hbg .menuTrigger.active span:nth-of-type(1) {
	-webkit-transform: translateY(5.5px) rotate(-45deg);
	transform: translateY(5.5px) rotate(-45deg);
}
#hbg .menuTrigger.active span:nth-of-type(2) {
	-webkit-transform: translateY(-5.5px) rotate(45deg);
	transform: translateY(-5.5px) rotate(45deg);
}
/* スマホ　ハンバーガ---------------------------------------- */
@media screen and (max-width: 767px) {
	#hbg {
		position: absolute;
		top: 28px;
		right: 18px;
	}
	#hbg.fixed {
		position: absolute;
		top: 26px;
		right: 24px;
	}

	#hbg .menuTrigger {
		width: 28px;
		height: 22px;
	}
	#hbg .menuTrigger span:nth-of-type(1) {
		top: 5px;
	}
	#hbg .menuTrigger span:nth-of-type(2) {
		bottom: 5px;
	}
	#hbg .menuTrigger.active span:nth-of-type(1) {
		-webkit-transform: translateY(6px) rotate(-45deg);
		transform: translateY(6px) rotate(-45deg);
	}
	#hbg .menuTrigger.active span:nth-of-type(2) {
		-webkit-transform: translateY(-6px) rotate(45deg);
		transform: translateY(-6px) rotate(45deg);
	}
	#hbg .menuTrigger:hover span {
		background-color: #000;
	}
	body.home #hbg .menuTrigger span {
		background-color: #FFF;
	}
	body.home #hbg .menuTrigger:hover span {
		background-color: #FFF;
	}
}
#hbg.on_loaded{
	animation: slide_top 600ms ease 1200ms both;
}
#page_scroll.on_loaded{
	animation: fade_in 600ms ease 2600ms both;
} 
/* lide_top-------------------------------- */
@keyframes slide_top {
  0% {
    -webkit-transform: translateY(-20px);
            transform: translateY(-20px);
            opacity:0;
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
            opacity:1;
  }
}
@keyframes fade_in {
  0% {opacity:0;}
  100% {opacity:1;}
}
/* logo01------------------------------------- */
#logo01 {
	position: fixed;
    top: 50px;
    left: 37px;
    /* filter: invert(100%);
    margin-top: -20px; */
}
#logo01.scrolled {
    filter:none;
}
#logo01 img {
	width: 75px;
}
#logo01,
#hbg {
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	-ms-transition: all 0.3s;
	-o-transition: all 0.3s;
	transition: all 0.3s;
}
#hbg.animate01 {
	-webkit-animation:animateFixed2 0.8s linear 0s 1;
	animation:animateFixed2 0.8s linear 0s 1;
	display: block;
}
#logo01.animate01 {
	-webkit-animation:animateFixed1 0.8s linear 0s 1;
	animation:animateFixed1 0.8s linear 0s 1;
	display: block;
}
/* LOADED --------------------------------------*/
.show { transition: all 0.5s; }
.show { opacity: 0; -webkit-transform: translate(0, 50px); -ms-transform: translate(0, 50px); transform: translate(0, 50px); }
.show.is_done { opacity: 1; -webkit-transform: translate(0, 0px); -ms-transform: translate(0, 0px); transform: translate(0, 0px); }

/* .slideTxt ------------------------------------*/
.slideTxt span{
	display: inline-block;
	transition: all 0.5s; 
	opacity: 0;
	-webkit-transform: translateY(20px); 
	-ms-transform: translateY(20px); 
	transform: translateY(20px); 
}
.slideTxt span.is_show { 
	opacity: 1; 
	-webkit-transform: translateY(0); 
	-ms-transform: translateY(0); 
	transform: translateY(0); 
}
@media screen and (max-width: 767px) {
	#logo01 {
		top:10px;
		left: 10px;
		margin: 0;
		width: 45px;
		z-index: 2;
	}
}
/* logo02 ------------------------------------------*/
#logo02 {
	position: absolute;
	top: 58px;
	left: 51px;
	z-index: 10;
}
#logo02 img {
	width: 31px;
}
.suisai001{
padding-top: -120%; 
width: 30%;
}
@media screen and (max-width: 767px) {
	#logo02 {
		position: absolute;
		top: 20px;
		left: 24px;
	}
	#logo02 img {
		width: 21px;
	}
}
/* lowerBg01 -------------------------------------------*/
#lowerBg01 {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	min-width: 1000px;
	height: 708px;
	background: linear-gradient(90deg,rgba(34,34,34,1) 0%,rgba(34,34,34,1) 54.0995%,rgba(255,255,255,0) 54.0995%,rgba(255,255,255,0) 100%);
	background: -webkit-linear-gradient(0deg,rgba(34,34,34,1) 0%,rgba(34,34,34,1) 54.0995%,rgba(255,255,255,0) 54.0995%,rgba(255,255,255,0) 100%);
	z-index: 1;
}
@media screen and (max-width: 767px) {
	#lowerBg01 {
		min-width: 0;
		height: 451px;
		background: linear-gradient(90deg,rgba(34,34,34,1) 0%,rgba(34,34,34,1) 70.6%,rgba(255,255,255,0) 70.6%,rgba(255,255,255,0) 100%);
		background: -webkit-linear-gradient(0deg,rgba(34,34,34,1) 0%,rgba(34,34,34,1) 70.6%,rgba(255,255,255,0) 70.6%,rgba(255,255,255,0) 100%);
	}
	body.awards #lowerBg01 {
		height: 292px;
	}
}
/* menuSp
------------------------------------------ */
#overlay {
	position: fixed;
	top: 0;
	right: -100%;
	width: 400px;
	height: 100%;
}
#menuSp {
	position: fixed;
	top: 0;
	right: -100%;
	background: #FFF;
	width: 400px;
	color: #000;
	font-family: 'Roboto', sans-serif;
	font-weight: bold;
	z-index: 1001;
}
#menuSp a {
	color: #000;
}
#menuSp > .vessel {
	padding: 130px 60px 60px 60px;
}
#menuSp > .vessel > .navBlock01 > dl {
	margin-top: 77px;
}
#menuSp > .vessel > .navBlock01 > dl:first-child {
	margin-top: 0;
}
#menuSp > .vessel > .navBlock01 > dl.single01 {
	margin-top: 74px;
}
#menuSp dl > dt {
	margin-bottom: 8px;
	font-size: 13px;
	letter-spacing: 0.23em;
}
#menuSp dl > dd {
	font-size: 20px;
	letter-spacing: 0.2em;
}
#menuSp dl > dd a:hover {
	text-decoration: none;
	opacity: 0.5;
}
#menuSp .close01 {
	position: absolute;
	top: 40px;
	right: 48px;
}
#menuSp .close01 a {
	display: inline-block;
	position: relative;
	width: 39px;
	height: 28px;
	opacity: 1;
}
#menuSp .close01 a:hover {
	filter: alpha(opacity=70);
	-moz-opacity: 0.70;
	opacity: 0.70;
}
#menuSp .close01 a span {
	display: inline-block;
	transition: all .4s;
	box-sizing: border-box;
	outline: none;
}
#menuSp .close01 a span {
	position: absolute;
	left: 0;
	width: 100%;
	height: 2px;
	background-color: #000;
}
#menuSp .close01 a span:nth-of-type(1) {
	top: 8px;
}
#menuSp .close01 a span:nth-of-type(2) {
	bottom: 7px;
}
#menuSp .close01 a.move span:nth-of-type(1) {
	-webkit-transform: translateY(5.5px) rotate(-45deg);
	transform: translateY(5.5px) rotate(-45deg);
}
#menuSp .close01 a.move span:nth-of-type(2) {
	-webkit-transform: translateY(-5.5px) rotate(45deg);
	transform: translateY(-5.5px) rotate(45deg);
}
@media screen and (max-width: 767px) {
	#overlay {
		width: 100%;
		box-shadow: 0 0 0 0 rgba(0,0,0,0.16);
		-webkit-box-shadow: 0 0 0 0 rgba(0,0,0,0.16);
		-moz-box-shadow: 0 0 0 0 rgba(0,0,0,0.16);
	}
	#menuSp {
		width: 100%;
		text-align: center;
	}
	#menuSp > .vessel {
		padding: 72px 20px 20px 20px;
	}
	#menuSp > .vessel > .navBlock01 > dl {
		margin-top: 30px;
	}
	#menuSp > .vessel > .navBlock01 > dl:first-child {
		margin-top: 0;
	}
	#menuSp > .vessel > .navBlock01 > dl.single01 {
		margin-top: 29px;
	}
	#menuSp > .vessel > .navBlock01 > dl.single01 + dl.single01 {
		margin-top: 25px;
	}
	#menuSp dl > dt {
		margin-bottom: 12px;
		font-size: 11px;
	}
	#menuSp dl > dd {
		font-size: 16px;
		letter-spacing: 0.25em;
	}
	#menuSp dl.single01 > dd {
		font-size: 20px;
		letter-spacing: 0.2em;
	}
	#menuSp dl > dd a:hover {
		opacity: 1;
	}
	#menuSp dl > dd ul li {
		margin-top: 7px;
	}
	#menuSp dl > dd ul li:first-child {
		margin-top: 0;
	}

	#menuSp .close01 {
		position: absolute;
		top: 26px;
		right: 24px;
	}
	#menuSp .close01 a {
		width: 32px;
		height: 24px;
	}
	#menuSp .close01 a:hover {
		filter: alpha(opacity=100);
		-moz-opacity: 1;
		opacity: 1;
	}
	#menuSp .close01 a span:nth-of-type(1) {
		top: 5px;
	}
	#menuSp .close01 a span:nth-of-type(2) {
		bottom: 5px;
	}
	#menuSp .close01 a.move span:nth-of-type(1) {
		-webkit-transform: translateY(6px) rotate(-45deg);
		transform: translateY(6px) rotate(-45deg);
	}
	#menuSp .close01 a.move span:nth-of-type(2) {
		-webkit-transform: translateY(-6px) rotate(45deg);
		transform: translateY(-6px) rotate(45deg);
	}
}
/* menu2
------------------------------------------ */
#menu2{
	position: fixed;
	background:rgba(238, 238, 238, 0.94);
	width: 100%;
	height: 100vh;
	top: 0;
	left: 0;
	color:#eadfdfad;
	font-family: 'optima', sans-serif;
	font-weight: bold;
	z-index: 1001;
	opacity: 0;
	transform:matrix3d(.98, 0, 0, 0, 0, .98, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
	visibility: hidden;
	transition: all .3s ease-in;

}
#menu2.is_open{
	opacity: 1;
	transform:matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
	visibility: visible;
}
#menu2 .navBlock01{
	width: 80%;
	max-width: 1300px;
	min-width: 860px;
	margin: 240px auto 0 auto;
}
#menu2 .navBlock01 dl{
	float: left;
	width: 33.3%;
	padding:  0 20px;
	box-sizing: border-box;
	-webkit-transform: translateY(15px);
	transform: translateY(15px);
	opacity: 0;
	transition: all .3s .4s ease-out;
}
#menu2 .navBlock01 dl:nth-child(2) {
	transition-delay: .5s;
}
#menu2 .navBlock01 dl:nth-child(3) {
	transition-delay: .6s;
}

#menu2.is_open .navBlock01 dl{
	opacity: 1;
	-webkit-transform: translateY(0);
	transform: translateY(0);
}

#menu2 .navBlock01 dt{
	border-bottom: 1px solid #333;
    width: 100%;
    margin-bottom: 40px;
    font-size: 12px;
    letter-spacing: 0.05em;
    padding-bottom: 20px;
    line-height: 1;
    position: relative;
}
#menu2 .navBlock01 dd li{
    font-size: 18px;
    letter-spacing: 0.1em;
    padding-bottom: 32px;
    line-height: 1;
}

#menu2 .navBlock01 dd li a{
    color:#564f4f;
    text-transform: uppercase;
}
#menu2 .navBlock01 dd li a:hover{
    color: #999;
    text-decoration: none;
}
#menu2 .close01 {
	position: absolute;
	top: 38px;
	right: 46px;
}
#menu2 .close01 a {
	display: inline-block;
	position: relative;
	width: 38px;
	height: 28px;
	opacity: 1;
	cursor: pointer;
}
#menu2 .close01 a:hover {
	filter: alpha(opacity=70);
	-moz-opacity: 0.70;
	opacity: 0.70;
}
#menu2 .close01 a span {
	display: inline-block;
	transition: all .4s;
	box-sizing: border-box;
	outline: none;
}
#menu2 .close01 a span {
	position: absolute;
	left: 0;
	width: 100%;
	height: 2px;
	background-color: #999;
	transition: all .2s ease-out;
}
#menu2 .close01 a span:nth-of-type(1) {
	top: 8px;
}
#menu2 .close01 a span:nth-of-type(2) {
	bottom: 7px;
}
#menu2 .close01 a.move span:nth-of-type(1) {
	-webkit-transform: translateY(5.5px) rotate(-45deg);
	transform: translateY(5.5px) rotate(-45deg);
}
#menu2 .close01 a.move span:nth-of-type(2) {
	-webkit-transform: translateY(-5.5px) rotate(45deg);
	transform: translateY(-5.5px) rotate(45deg);
}
@media screen and (max-width: 767px) {
	#menu2{
		overflow: scroll;
	}
	#menu2 .close01{
		top: 14px;
		right: 18px;
	}
	#menu2 .close01 a{
		width: 28px;
		height: 22px;
	}
	#menu2 .close01 a span:nth-of-type(1){
		top:5px;
	}
	#menu2 .close01 a span:nth-of-type(2){
		bottom:5px;
	}
	#menu2 .close01 a.move span:nth-of-type(1) {
		-webkit-transform: translateY(5px) rotate(-45deg);
		transform: translateY(5px) rotate(-45deg);
	}
	#menu2 .close01 a.move span:nth-of-type(2) {
		-webkit-transform: translateY(-5px) rotate(45deg);
		transform: translateY(-5px) rotate(45deg);
	}
	
	#menu2 .navBlock01{
		width: 80%;
		min-width: 280px;
		margin: 110px auto 0 auto;
	}
	#menu2 .navBlock01 dl{
		float: none;
		width: 100%;
	}
	#menu2 .navBlock01 dt{
		font-size: 10px;
		padding-bottom: 15px;
		margin: 30px 0;
	}
	#menu2 .navBlock01 .single01 dt{
		margin-top: 10px;
	}
	#menu2 .navBlock01 dd li{
		font-size: 14px;
		padding-bottom: 25px;
	}
}

/* header
-----------------------------------------------*/
#header {
	position: relative;
	padding: 104px 0;
	min-width: 1000px;
	height: 100%;
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	z-index: 1;
}
#header .left {
	position: absolute;
	top: 104px;
	left: 0;
	width: 130px;
	height: 100%;
}
#header .right {
	position: absolute;
	top: 104px;
	right: 0;
	width: 130px;
	height: 100%;
}
#header::before {
	content: " ";
	position: absolute;
	top: 0;
	left: 0;
	display: block;
	width: 100%;
	height: 104px;
}
#header::after {
	content: " ";
	position: absolute;
	bottom: 0;
	left: 0;
	display: block;
	width: 100%;
	height: 104px;
}
#header .scaleMod01 {
    position: relative;
    margin: 0 130px;
    width: calc(100% - 260px);
    height: 100%;
    background-size: 600% 600%;
    z-index: 2;
}
#header .logo01 {
    /* position: absolute;
    top: 50%;
    left: 50%;
    width: 100%;
    margin: -6% 0 0 -50%;
    color: #FFF;
    font-size: 3vw;
		font-family: "lamar pen", sans-serif;
		font-size: 60px;
    font-weight: 700;
    line-height: 1.6;
    text-align: center;
    text-indent: 0.2em;
    letter-spacing: 0.2em;
		z-index: 4; */
		position: absolute;
    top: 54%;
    left: 64%;
    width: 70%;
    margin: -6% 0 0 -50%;
    color: #FFF;
    font-size: 3vw;
    font-family: "lamar pen", sans-serif;
    font-size: 60px;
    font-weight: 700;
    line-height: 1.6;
    text-align: center;
    text-indent: 0.2em;
    letter-spacing: 0.2em;
    z-index: 4;
}
#header .text01 {
	position: absolute;
	top: 50%;
	margin-top: -50px;
	left: -72px;
	color: #333;
	font-size: 20px;
	letter-spacing: 0.1em;
	font-family: "Optima", sans-serif;
	font-weight: 700;
	line-height: 1;
	writing-mode: vertical-rl;
	-webkit-writing-mode: vertical-rl;
	-ms-writing-mode: tb-rl;
}
#header .scaleMod01::before {
	content: " ";
	position: absolute;
	top: 0;
	left: 0;
	display: block;
	width: 100%;
	height: 100%;
	background: linear-gradient(90deg,rgba(0,0,0,0.7) 0%,rgba(0,0,0,0.7) 50%,rgba(238,238,238,0.79) 50%,rgba(238,238,238,0.79) 100%);
	background: -webkit-linear-gradient(0deg,rgba(11, 228, 239, 0.18) 0%,rgba(143, 203, 247, 0.48) 50%,rgba(238,238,238,0.79) 50%,rgba(238,238,238,0.79) 100%);
	opacity: .9;
	transition: .6s;
	z-index: 3;
}
#header .scaleMod01.on_hover::before {
	opacity: 0;
}

#header .scaleMod01::after {
	content: " ";
	position: absolute;
	top: 50%;
	left: 50%;
	display: block;
	margin: -1px 0 0 -5%;
	width:10%;
	height: 2px;
	/* background: linear-gradient(90deg,#FFF 0%,#FFF 50%,#000 50%,#000 100%);
	background: -webkit-linear-gradient(0deg,#FFF 0%,#FFF 50%,#000 50%,#000 100%); */
	z-index: 4;
	transition: .2s;
}
#header .scaleMod01.on_hover::after {
	width: 14%;
	margin-left: -7%;	
}
/* スマホHeader----------------------------------------- */
@media screen and (max-width: 767px) {
	#header {
		padding: 0;
		min-width: 0;
		/* height: 402px; */
		background: #FFF;
	}
	#header .left {
		display: none;
	}
	#header .right {
		display: none;
	}
	#header::before {
		display: none;
	} 
	#header::after {
		display: none;
	}
	#header .scaleMod01 {
		width: 100%;
		margin: 0;
		background: linear-gradient(45deg, rgba(51, 51, 51, 0.65), rgba(138, 138, 138, 0.61), rgb(0, 0, 0));
		background: -webkit-linear-gradient(45deg, rgba(51, 51, 51, 0.65), rgba(138, 138, 138, 0.61), rgb(0, 0, 0));
		background-size: 1000%;
		animation-duration: 10s;
		
	}
	#header .scaleMod01::before {
		display: none;
	}
	#header .scaleMod01::after {
		display: none;
	}
	#header .text01 {
		position: absolute;
		top: 170px;
		left: 16px;
		font-size: 11px;
		letter-spacing: 0.17em;
	}
	#header .logo01 {
		position: relative;
		margin: 0;
		top:auto;
		left: auto;
		/* padding-top: 90px; */
		padding: 48px;
		width: auto;
		font-size: 30px;
		line-height: 1.6;
		text-indent: 0.3em;
		letter-spacing: 0.3em;
	}
	#header .button01 {
		position: relative;
		top: auto;
		right: auto;
		margin: 0;
		width: auto;
	}
	#header .button01::before {
		content: " ";
		display: block;
		margin: 8px auto 13px auto;
		width: 1px;
		height: 30px;
		background: #CCC;
	}
	#header .button01 a {
		padding: 0;
		border: none;
		width: auto;
		height: auto;
		font-size: 12px;
		color: #FFF;
	}
	#header .button01 a::before {
		display: none;
	}
	#header .button01 a:hover {
		background: transparent;
	}
}

/* scaleMod01
------------------------------------------ */
.scaleMod01 {
    margin: 0 130px;
    width: auto;
    min-width: 733px;
	}
@media screen and (min-width: 1501px) {
	.scaleMod01 {
		margin: 0 auto;
		width: 1232px;
	}
}
@media screen and (max-width: 767px) {
	.scaleMod01 {
		margin: 0;
		min-width: 0;
	}
}
/* wrapper
------------------------------------------ */
#wrapper {
	overflow: hidden;
}

h1 {
    display: block;
    font-size: 2em;
    margin-block-start: 0.67em;
    margin-block-end: 0.67em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    font-weight: bold;
	}
h2{
		text-align: center;
		font-size: 50px;
		padding-bottom: 88px;
	}

.mainvisual{
	position: relative;
	background-image:url("portfolio/pro-header/main-min.jpg");
	background-size:cover;
	max-width: 100%;
}

/* zoomslider js
-----------------------------------------------*/

.zs-enabled{
	position:relative
}
.zs-enabled 
.zs-slideshow,
.zs-enabled 
.zs-slides,
.zs-enabled 
.zs-slide{
	position:absolute;
	z-index:1;
	top:0;
	left:0;
	width:100%;
	height:100%;
	overflow:
	hidden
}
.zs-enabled 
.zs-slideshow 
.zs-slides 
.zs-slide{
	background:transparent none no-repeat 50% 50%;
	background-size:cover;
	position:absolute;
	visibility:hidden;
	opacity:0;
	-webkit-transform:scale(1.2, 1.2);
	-moz-transform:scale(1.2, 1.2);
	-ms-transform:scale(1.2, 1.2);
	-o-transform:scale(1.2, 1.2);
	transform:scale(1.2, 1.2)}
	.zs-enabled 
	.zs-slideshow 
	.zs-slides 
	.zs-slide
	.active{
		visibility:visible;
		opacity:1}
		.zs-enabled .zs-slideshow 
		.zs-bullets{
			position:absolute;
			z-index:4;
			bottom:20px;
			left:0;
			width:100%;
			text-align:center
		}
		.zs-enabled .zs-slideshow 
		.zs-bullets .zs-bullet{
			display:inline-block;
			cursor:pointer;
			border:2px solid #ccc;
			width:14px;height:14px;
			border-radius:8px;
			margin:10px;
			background-color:#4a4a4a
		}
		.zs-enabled .zs-slideshow 
		.zs-bullets .zs-bullet.active{
			background-color:#ccc
		}
		.zs-enabled 
		.zs-slideshow:after{
			content:" ";
			position:absolute;
			top:0;
			left:0;
			width:100%;
			height:100%;
			z-index:3;
			background:transparent none repeat 0 0
		}
		.zs-enabled.overlay-plain  
		.zs-slideshow:after{
			background-image:url("portfolio/pro-header/main01.jpg")
		}
		.zs-enabled.overlay-dots  
		.zs-slideshow:after{
			background-image:url("portfolio/pro-header/main02.png")
		}
		.zs-enabled.overlay-dots  
		.zs-slideshow:after{
			background-image:url("portfolio/pro-header/main03.png")
		}
		.zs-enabled.overlay-dots 
		.zs-slideshow:after{
			background-image:url("portfolio/pro-header/main04.jpg")
		}
	#demo-1{
    overflow: hidden;
    width: 100%;
		min-height: 800px;
    background-color: #999;
    position: relative;
}

/* テキスト部分     */
/* .inner-content{ 
    color: white;
    width: 100%;
    text-align: center;
    position: absolute;
    top: 50%;
    left: 0;
		transform: translateY(-50%);
}
  .main-text{
    font-size: 2em;
    }
}*/

/* zoomslider js
-----------------------------------------------*/

/* contact
----------------------------------------------*/
.button01{
	text-align: center;
	/* padding: 80px; */
	
}
.buttonMod01{
    position: relative;
    display: inline-block;
    padding: 43px 10px 0 10px;
    width: 400px;
    height: 94px;
    background: #333;
    background: linear-gradient(45deg, rgba(34,34,34,1), rgba(34,34,34,1), rgba(34,34,34,1));
    color: #ffffff;
    font-size: 14px;
    font-family: "Optima", sans-serif;
    font-weight: bold;
    line-height: 1;
    text-align: center;
    text-indent: 0.15em;
    letter-spacing: 0.15em;
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-shadow: 0px 10px 15px 0px rgba(0,0,0,0.2);
    -webkit-box-shadow: 0px 10px 15px 0px rgba(0,0,0,0.2);
    -moz-box-shadow: 0px 10px 15px 0px rgba(0,0,0,0.2);
    z-index: 1;
}
a.buttonMod01::before {
    content: '';
    position: absolute;
    top: 47px;
    right: 0;
    width: 20px;
    height: 1px;
    background-color: #FFF;
    transition: .2s;
		text-align: center;
}
/* contact
----------------------------------------------*/
/* indexAboutArea
------------------------------------------ */
.indexAboutArea {
	position: relative;
	padding: 1px 0 0 0;
	min-width: 1000px;
	background: #FFF;
	text-align: center;
	z-index: 2;
}
.indexAboutArea .aboutBox01 {
	margin: 131px auto 0 auto;
	padding: 38px 10px 94px 10px;
	width: 514px;
	background: #FFF;
	color: #555;
	font-size: 12px;
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
}
@media screen and (max-width: 767px){
.indexAboutArea .aboutBox01{
	margin: 0 auto;
}
}


/* indexAboutArea
-------------------------------------------------------- */
/* listKomeMod01 */
.listKomeMod01 > li {
	padding-left: 1em;
	text-indent: -1em;
}
.newworks{
	padding: 50px;
}
/* buttonMod01
-------------------------------------------------------- */
a.buttonMod01 {
	position: relative;
	display: inline-block;
	padding: 43px 10px 0 10px;
	width: 400px;
	height: 94px;
	background: #222;
	background: linear-gradient(45deg, rgba(34,34,34,1), rgba(34,34,34,1), rgba(34,34,34,1));
	color: #FFF;
	font-size: 14px;
	font-family: "Optima", sans-serif;
	font-weight: bold;
	line-height: 1;
	text-align: center;
	text-indent: 0.15em;
	letter-spacing: 0.15em;
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-shadow: 0px 10px 15px 0px rgba(0,0,0,0.2);
	-webkit-box-shadow: 0px 10px 15px 0px rgba(0,0,0,0.2);
	-moz-box-shadow: 0px 10px 15px 0px rgba(0,0,0,0.2);
	z-index: 1;
}
a.buttonMod01:hover {
	background: linear-gradient(45deg, rgba(0,0,255,.9), rgba(255,255,0,.9), rgba(255,0,0,.9));
	background: -webkit-linear-gradient(45deg, rgba(0,0,255,.9), rgba(255,255,0,.9), rgba(255,0,0,.9));
	background-size: 600% 600%;
	animation: AnimeGrade 10s ease infinite;
	text-decoration: none;
	letter-spacing: 0.28em;
	box-shadow: 0px 10px 20px 0px rgba(0,0,0,0.3);
	-webkit-box-shadow: 0px 10px 20px 0px rgba(0,0,0,0.3);
	-moz-box-shadow: 0px 10px 20px 0px rgba(0,0,0,0.3);
}
a.buttonMod01::before {
    content: '';
    position: absolute;
    top: 47px;
    right: 0;
    width: 20px;
    height: 1px;
    background-color: #FFF;
    transition: .2s;
}
a.buttonMod01:hover:before {
	width: 40px;
}
/* buttonMod01
-------------------------------------------------------- */

/* indexNewReelArea
-------------------------------------------------------- */

/* indexNewReelArea
------------------------------------------ */
.indexNewReelArea {
	padding: 104px 0 200px 0;
	min-width: 1000px;
}
.indexNewReelArea .newReelSlider01 {
	margin-top: 56px;
}
.indexNewReelArea .newReelSlider01 .slider > div {
	position: relative;
	line-height: 0;
}
.indexNewReelArea .newReelSlider01 .slider > div img {
	width: auto;
	height: 450px;
}
.indexNewReelArea .newReelSlider01 .slider > div .sliderBox01Wrap {
	position: relative;
	display: block;
	max-width: 1100px;
	height: 450px;
	z-index: 1;
}
.indexNewReelArea .newReelSlider01 .slider > div .sliderBox01Wrap:hover {
	opacity: 0.8;
}
.indexNewReelArea .newReelSlider01 .slider .film_roll_child .sliderBox01 {
	position: absolute;
	top: 75px;
	display: block;
	margin-left: 70px;
	width: 380px;
	height: 300px;
	background: #FFF;
	z-index: 2;
	display: -webkit-flex;
	display: flex;
	-webkit-align-items: center;
	align-items: center;
	opacity: 0;
	transform: translateY(15px) scale(.97);
	transition: all .4s .9s ease-out;
}
.indexNewReelArea .newReelSlider01 .slider .film_roll_child.active .sliderBox01 {
	opacity: 1;
	transform: translateY(0) scale(1);
}
.indexNewReelArea .newReelSlider01 .slider .film_roll_child .sliderBox01 .vessel {
	display: block;
	position: relative;
	box-sizing: border-box;
	width: 100%;
	height: 100%;
	padding: 60px;
	color: #000;
	font-family: 'Optima', sans-serif;
	font-weight: 700;
	opacity: 0;
	transform: translateY(15px);
	transition: all .4s 1.2s ease-in-out;
}
.indexNewReelArea .newReelSlider01 .slider .film_roll_child.active .sliderBox01 .vessel {
	opacity: 1;
	transform: translateY(0);
}
.indexNewReelArea .newReelSlider01 .slider > div .sliderBox01 > .vessel .text01 {
	display: block;
	margin-top: -7px;
	font-size: 24px;
	line-height: 1.5;
	letter-spacing: 0.1em;
	text-transform: uppercase;

}
.indexNewReelArea .newReelSlider01 .slider > div .sliderBox01 > .vessel .text02 {
	display: block;
	margin-top: 12px;
	font-size: 14px;
	line-height: 1.2;
	letter-spacing: 0.1em;
}
.indexNewReelArea .newReelSlider01 .slider > div .sliderBox01 > .vessel .text03 {
	display: block;
	position: absolute;
	bottom: 55px;
	font-size: 11px;
	line-height: 1.2;
	color: #999;
	text-transform: uppercase;
	font-weight: normal;
	letter-spacing: 0.1em;
}
.indexNewReelArea .newReelSlider01 .navBlock01 {
	position: relative;
	margin: -35px auto 0 auto;
	width: 1000px;
}
.indexNewReelArea .newReelSlider01 .navBlock01 #sliderPrev {
	position: absolute;
	top: 0;
	right: 71px;
	width: 70px;
	height: 70px;
	background: #222 url(portfolio/pro-body/newworks04-min.png) no-repeat 50% 50%;
	background-size: 11px;
	text-indent: -9999px;
	overflow: hidden;
	box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.2);
	-webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.2);
	-moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.2);
	z-index: 2;
	cursor: pointer;
}
.indexNewReelArea .newReelSlider01 .navBlock01 #sliderNext {
	position: absolute;
	top: 0;
	right: 0;
	width: 70px;
	height: 70px;
	/* background: #222 url(../img_cmn/icn_slider_next_01.png) no-repeat 50% 50%; */
	background-size: 11px;
	text-indent: -9999px;
	overflow: hidden;
	box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.2);
	-webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.2);
	-moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.2);
	z-index: 2;
	cursor: pointer;
}
.indexNewReelArea .newReelSlider01 .navBlock01 #sliderNext:hover,
.indexNewReelArea .newReelSlider01 .navBlock01 #sliderPrev:hover {
	opacity: 0.8;
}
.indexNewReelArea .newReelList01 {
	margin: 175px -20px 0 -20px;
	overflow: hidden;
}
.indexNewReelArea .newReelList01 > .block01 {
	float: left;
	padding: 0 20px;
	width: 50%;
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
}
.indexNewReelArea .newReelList01 > .block02 {
	float: right;
	padding: 159px 20px 0 20px;
	width: 50%;
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
}
.indexNewReelArea .newReelList01 ul li {
	position: relative;
	margin-top: 40px;
	line-height: 0;
}
.indexNewReelArea .newReelList01 ul li:first-child {
	margin-top: 0;
}
.indexNewReelArea .newReelList01 ul li a {
	display: block;
	outline: none;
}
.indexNewReelArea .newReelList01 ul li a box01:hover{
	display: block;
	overflow: hidden;
}

.indexNewReelArea .newReelList01 ul li img {
	width: 100%;
	height: auto;
	-webkit-transform: scale(1);
	transform: scale(1);
	-webkit-transition: .3s ease-in-out;
	transition: .3s ease-in-out;
}
.indexNewReelArea .newReelList01 ul li a:hover img {
	-webkit-transform: scale(0.9);
	transform: scale(0.9);
}

.suisai01{
	position: relative;
}
.suisai01::before {
		content: "";
    width: 25%;
    height: 534px;
    /* display: block; */
    background: url(portfolio/back/pro_suisai01.png) no-repeat;
    background-size: cover;
    position: absolute;
		top: -181px;
    left: 0;
		opacity: 0.7;
		-webkit-transform: translate(0,219px);
		-webkit-transform: translate(0, 120px);
    transform: translate(0, 120px);
    -webkit-transition: all 1000ms;
		transition: all 1000ms; 
}

/* indexNewReelArea
-------------------------------------------------------- */
#work_content{
	box-sizing: border-box;
	padding: 0px 50px;
}
/* indexNewReelArea
-------------------------------------------------------- */
/* sliderBox_text
-------------------------------------------------------- */
/* .sliderBox01Wrap_text{
    position: absolute;
    bottom: 11px;
    z-index: 100;
    left: 30px;
    color: #fff;
	} */
/*!
/*!
*  - v1.5.0
* Homepage: http://bqworks.com/slider-pro/
* Author: bqworks
* Author URL: http://bqworks.com/
*/
/* Core
--------------------------------------------------*/
.slider-pro {
	position: relative;
	margin: 0 auto;
	-moz-box-sizing: content-box;
	box-sizing: content-box;
}

.sp-slides-container {
	position: relative;
}

.sp-mask {
	position: relative;
	overflow: hidden;
}

.sp-slides {
	position: relative;
	-webkit-backface-visibility: hidden;
	-webkit-perspective: 1000;
}

.sp-slide {
	position: absolute;
}

.sp-image-container {
	overflow: hidden;
}

.sp-image {
	position: relative;
	display: block;
	border: none;
}

.sp-no-js {
	overflow: hidden;
	max-width: 100%;
}

/* Thumbnails
--------------------------------------------------*/
.sp-thumbnails-container {
	position: relative;
	overflow: hidden;
	direction: ltr;
}

.sp-top-thumbnails,
.sp-bottom-thumbnails  {
	left: 0;
	margin: 0 auto;
}

.sp-top-thumbnails {
	position: absolute;
	top: 0;
	margin-bottom: 4px;
}

.sp-bottom-thumbnails {
	margin-top: 4px;
}

.sp-left-thumbnails,
.sp-right-thumbnails {
	position: absolute;
	top: 0;
}

.sp-right-thumbnails {
	right: 0;
	margin-left: 4px;
}

.sp-left-thumbnails {
	left: 0;
	margin-right: 4px;
}

.sp-thumbnails {
	position: relative;
}

.sp-thumbnail {
    border: none;
}

.sp-thumbnail-container {
	position: relative;
	display: block;
	overflow: hidden;
	float: left;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

.sp-rtl .sp-thumbnail-container {
	float: right;
}

/* Horizontal thumbnails
------------------------*/
.sp-top-thumbnails .sp-thumbnail-container,
.sp-bottom-thumbnails .sp-thumbnail-container {
	margin-left: 2px;
	margin-right: 2px;
}

.sp-top-thumbnails .sp-thumbnail-container:first-child,
.sp-bottom-thumbnails .sp-thumbnail-container:first-child {
	margin-left: 0;
}

.sp-top-thumbnails .sp-thumbnail-container:last-child,
.sp-bottom-thumbnails .sp-thumbnail-container:last-child {
	margin-right: 0;
}

/* Vertical thumbnails 
----------------------*/
.sp-left-thumbnails .sp-thumbnail-container,
.sp-right-thumbnails .sp-thumbnail-container {
	margin-top: 2px;
	margin-bottom: 2px;
}

.sp-left-thumbnails .sp-thumbnail-container:first-child,
.sp-right-thumbnails .sp-thumbnail-container:first-child {
	margin-top: 0;
}

.sp-left-thumbnails .sp-thumbnail-container:last-child,
.sp-right-thumbnails .sp-thumbnail-container:last-child {
	margin-bottom: 0;
}

/* Right thumbnails with pointer
--------------------------------*/
.sp-right-thumbnails.sp-has-pointer {
	margin-left: -13px;
}

.sp-right-thumbnails.sp-has-pointer .sp-thumbnail {
	position: absolute;
	left: 18px;
	margin-left: 0 !important;
}

.sp-right-thumbnails.sp-has-pointer .sp-selected-thumbnail:before {
	content: '';
	position: absolute;
	height: 100%;
	border-left: 5px solid #F00;
	left: 0;
	top: 0;
	margin-left: 13px;
}

.sp-right-thumbnails.sp-has-pointer .sp-selected-thumbnail:after {
	content: '';
	position: absolute;
	width: 0;
	height: 0;
	left: 0;
	top: 50%;
	margin-top: -8px;
	border-right: 13px solid #F00;
	border-top: 8px solid transparent;
	border-bottom: 8px solid transparent;
}

/* Left thumbnails with pointer
-------------------------------*/
.sp-left-thumbnails.sp-has-pointer {
	margin-right: -13px;
}

.sp-left-thumbnails.sp-has-pointer .sp-thumbnail {
	position: absolute;
	right: 18px;
}

.sp-left-thumbnails.sp-has-pointer .sp-selected-thumbnail:before {
	content: '';
	position: absolute;
	height: 100%;
	border-left: 5px solid #F00;
	right: 0;
	top: 0;
	margin-right: 13px;
}

.sp-left-thumbnails.sp-has-pointer .sp-selected-thumbnail:after {
	content: '';
	position: absolute;
	width: 0;
	height: 0;
	right: 0;
	top: 50%;
	margin-top: -8px;
	border-left: 13px solid #F00;
	border-top: 8px solid transparent;
	border-bottom: 8px solid transparent;
}

/* Bottom thumbnails with pointer
---------------------------------*/
.sp-bottom-thumbnails.sp-has-pointer {
	margin-top: -13px;
}

.sp-bottom-thumbnails.sp-has-pointer .sp-thumbnail {
	position: absolute;
	top: 18px;
	margin-top: 0 !important;
}

.sp-bottom-thumbnails.sp-has-pointer .sp-selected-thumbnail:before {
	content: '';
	position: absolute;
	width: 100%;
	border-bottom: 5px solid #F00;
	top: 0;
	margin-top: 13px;
}

.sp-bottom-thumbnails.sp-has-pointer .sp-selected-thumbnail:after {
	content: '';
	position: absolute;
	width: 0;
	height: 0;
	left: 50%;
	top: 0;
	margin-left: -8px;
	border-bottom: 13px solid #F00;
	border-left: 8px solid transparent;
	border-right: 8px solid transparent;
}

/* Top thumbnails with pointer
------------------------------*/
.sp-top-thumbnails.sp-has-pointer {
	margin-bottom: -13px;
}

.sp-top-thumbnails.sp-has-pointer .sp-thumbnail {
	position: absolute;
	bottom: 18px;
}

.sp-top-thumbnails.sp-has-pointer .sp-selected-thumbnail:before {
	content: '';
	position: absolute;
	width: 100%;
	border-bottom: 5px solid #F00;
	bottom: 0;
	margin-bottom: 13px;
}

.sp-top-thumbnails.sp-has-pointer .sp-selected-thumbnail:after {
	content: '';
	position: absolute;
	width: 0;
	height: 0;
	left: 50%;
	bottom: 0;
	margin-left: -8px;
	border-top: 13px solid #F00;
	border-left: 8px solid transparent;
	border-right: 8px solid transparent;
}

/* Layers
--------------------------------------------------*/
.sp-layer {
	position: absolute;
	margin: 0;
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-webkit-font-smoothing: subpixel-antialiased;
	-webkit-backface-visibility: hidden;
}

.sp-black {
	color: #FFF;
	background: rgb(0, 0, 0);
	background: rgba(0, 0, 0, 0.7);
}

.sp-white {
	color: #000;
	background: rgb(255, 255, 255);
	background: rgba(255, 255, 255, 0.7);
}

.sp-rounded {
	border-radius: 10px;
}

.sp-padding {
	padding: 10px;
}

/* Touch Swipe
--------------------------------------------------*/
.sp-grab {
	cursor: url(portfolio/pro-body/slider_01.png), move;
}

.sp-grabbing {
	cursor: url(portfolio/pro-body/slider_02.png), move;
}

.sp-selectable {
	cursor: default;
}

/* Caption
--------------------------------------------------*/
.sp-caption-container {
	text-align: center;
	margin-top: 10px;
}

/* Full Screen
--------------------------------------------------*/
.sp-full-screen {
	margin: 0 !important;
	background-color: #000;
}

.sp-full-screen-button {
	position: absolute;
	top: 5px;
	right: 10px;
	font-size: 30px;
	line-height: 1;
	cursor: pointer;
	-webkit-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	transform: rotate(45deg);
}

.sp-full-screen-button:before {
	content: '\2195';
}

.sp-fade-full-screen {
	opacity: 0;
	-webkit-transition: opacity 0.5s;
	transition: opacity 0.5s;
}

.slider-pro:hover .sp-fade-full-screen {
	opacity: 1;
}

/* Buttons
--------------------------------------------------*/
.sp-buttons {
	position: relative;
	width: 100%;
	text-align: center;
	padding-top: 10px;
}

.sp-rtl .sp-buttons {
	direction: rtl;
}

.sp-full-screen .sp-buttons {
	display: none;
}

.sp-button {
	width: 10px;
	height: 10px;
	border: 2px solid #000;
	border-radius: 50%;
	margin: 4px;
	display: inline-block;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	cursor: pointer;
}

.sp-selected-button {
	background-color: #000;
}

@media only screen and (min-width: 768px) and (max-width: 1024px) {
	.sp-button {
		width: 14px;
		height: 14px;
	}
}

@media only screen and (min-width: 568px) and (max-width: 768px) {
	.sp-button {
		width: 16px;
		height: 16px;
	}
}

@media only screen and (min-width: 320px) and (max-width: 568px) {
	.sp-button {
		width: 18px;
		height: 18px;
	}
}

/* Arrows
--------------------------------------------------*/
.sp-arrows {
	position: absolute;
}

.sp-fade-arrows {
	opacity: 0;
	-webkit-transition: opacity 0.5s;
	transition: opacity 0.5s;
}

.sp-slides-container:hover .sp-fade-arrows {
	opacity: 1;
}

.sp-horizontal .sp-arrows {
	width: 100%;
	left: 0;
	top: 50%;
	margin-top: -15px;
}

.sp-vertical .sp-arrows {
	height: 100%;
	left: 50%;
	top: 0;
	margin-left: -10px;
}

.sp-arrow {
	position: absolute;
	display: block;
	width: 20px;
	height: 30px;
	cursor: pointer;
}

.sp-vertical .sp-arrow {
	-webkit-transform: rotate(90deg);
	-ms-transform: rotate(90deg);
	transform: rotate(90deg);
}

.sp-horizontal .sp-previous-arrow {
	left: 20px;
	right: auto;
}

.sp-horizontal.sp-rtl .sp-previous-arrow {
	right: 20px;
	left: auto;
}

.sp-horizontal .sp-next-arrow {
	right: 20px;
	left: auto;
}

.sp-horizontal.sp-rtl .sp-next-arrow {
	left: 20px;
	right: auto;
}

.sp-vertical .sp-previous-arrow {
	top: 20px;
}

.sp-vertical .sp-next-arrow {
	bottom: 20px;
	-webkit-transform: rotate(270deg);
	-ms-transform: rotate(270deg);
	transform: rotate(270deg);
}

.sp-previous-arrow:before,
.sp-previous-arrow:after,
.sp-next-arrow:before,
.sp-next-arrow:after {
	content: '';
	position: absolute;
	width: 50%;
	height: 50%;
	background-color: #FFF;
}

.sp-arrow:before {
	left: 30%;
	top: 0;
	-webkit-transform: skew(145deg, 0deg);
	-ms-transform: skew(145deg, 0deg);
	transform: skew(145deg, 0deg);
}

.sp-arrow:after {
	left: 30%;
	top: 50%;
	-webkit-transform: skew(-145deg, 0deg);
	-ms-transform: skew(-145deg, 0deg);
	transform: skew(-145deg, 0deg);
}

.sp-next-arrow {
	-webkit-transform: rotate(180deg);
	-ms-transform: rotate(180deg);
	transform: rotate(180deg);
}

.sp-horizontal.sp-rtl .sp-previous-arrow {
	-webkit-transform: rotate(180deg);
	-ms-transform: rotate(180deg);
	transform: rotate(180deg);
}

.sp-horizontal.sp-rtl .sp-next-arrow {
	-webkit-transform: rotate(0deg);
	-ms-transform: rotate(0deg);
	transform: rotate(0deg);
}

.ie8 .sp-arrow,
.ie7 .sp-arrow {
	width: 0;
	height: 0;
}

.ie8 .sp-arrow:before,
.ie8 .sp-arrow:after,
.ie7 .sp-arrow:before,
.ie7 .sp-arrow:after {
	content: none;
}

.ie8.sp-horizontal .sp-previous-arrow,
.ie7.sp-horizontal .sp-previous-arrow {
	border-right: 20px solid #FFF;
	border-top: 20px solid transparent;
	border-bottom: 20px solid transparent;
}

.ie8.sp-horizontal .sp-next-arrow,
.ie7.sp-horizontal .sp-next-arrow {
	border-left: 20px solid #FFF;
	border-top: 20px solid transparent;
	border-bottom: 20px solid transparent;
}

.ie8.sp-vertical .sp-previous-arrow,
.ie7.sp-vertical .sp-previous-arrow {
	border-bottom: 20px solid #FFF;
	border-left: 20px solid transparent;
	border-right: 20px solid transparent;
}

.ie8.sp-vertical .sp-next-arrow,
.ie7.sp-vertical .sp-next-arrow {
	border-top: 20px solid #FFF;
	border-left: 20px solid transparent;
	border-right: 20px solid transparent;
}

/* Thumbnail Arrows
--------------------------------------------------*/
.sp-thumbnail-arrows {
	position: absolute;
}

.sp-fade-thumbnail-arrows {
	opacity: 0;
	-webkit-transition: opacity 0.5s;
	transition: opacity 0.5s;
}

.sp-thumbnails-container:hover .sp-fade-thumbnail-arrows {
	opacity: 1;
}

.sp-top-thumbnails .sp-thumbnail-arrows,
.sp-bottom-thumbnails .sp-thumbnail-arrows {
	width: 100%;
	top: 50%;
	left: 0;
	margin-top: -12px;
}

.sp-left-thumbnails .sp-thumbnail-arrows,
.sp-right-thumbnails .sp-thumbnail-arrows {
	height: 100%;
	top: 0;
	left: 50%;
	margin-left: -7px;
}

.sp-thumbnail-arrow {
	position: absolute;
	display: block;
	width: 15px;
	height: 25px;
	cursor: pointer;
}

.sp-left-thumbnails .sp-thumbnail-arrows .sp-thumbnail-arrow,
.sp-right-thumbnails .sp-thumbnail-arrows .sp-thumbnail-arrow {
	-webkit-transform: rotate(90deg);
	-ms-transform: rotate(90deg);
	transform: rotate(90deg);
}

.sp-top-thumbnails .sp-previous-thumbnail-arrow,
.sp-bottom-thumbnails .sp-previous-thumbnail-arrow {
	left: 0px;
}

.sp-top-thumbnails .sp-next-thumbnail-arrow,
.sp-bottom-thumbnails .sp-next-thumbnail-arrow {
	right: 0px;
}

.sp-left-thumbnails .sp-previous-thumbnail-arrow,
.sp-right-thumbnails .sp-previous-thumbnail-arrow {
	top: 0px;
}

.sp-left-thumbnails .sp-next-thumbnail-arrow,
.sp-right-thumbnails .sp-next-thumbnail-arrow {
	bottom: 0px;
}

.sp-previous-thumbnail-arrow:before,
.sp-previous-thumbnail-arrow:after,
.sp-next-thumbnail-arrow:before,
.sp-next-thumbnail-arrow:after {
	content: '';
	position: absolute;
	width: 50%;
	height: 50%;
	background-color: #FFF;
}

.sp-previous-thumbnail-arrow:before {
	left: 30%;
	top: 0;
	-webkit-transform: skew(145deg, 0deg);
	-ms-transform: skew(145deg, 0deg);
	transform: skew(145deg, 0deg);
}

.sp-previous-thumbnail-arrow:after {
	left: 30%;
	top: 50%;
	-webkit-transform: skew(-145deg, 0deg);
	-ms-transform: skew(-145deg, 0deg);
	transform: skew(-145deg, 0deg);
}

.sp-next-thumbnail-arrow:before {
	right: 30%;
	top: 0;
	-webkit-transform: skew(35deg, 0deg);
	-ms-transform: skew(35deg, 0deg);
	transform: skew(35deg, 0deg);
}

.sp-next-thumbnail-arrow:after {
	right: 30%;
	top: 50%;
	-webkit-transform: skew(-35deg, 0deg);
	-ms-transform: skew(-35deg, 0deg);
	transform: skew(-35deg, 0deg);
}

.ie8 .sp-thumbnail-arrow,
.ie7 .sp-thumbnail-arrow {
	width: 0;
	height: 0;
}

.ie8 .sp-thumbnail-arrow:before,
.ie8 .sp-thumbnail-arrow:after,
.ie7 .sp-thumbnail-arrow:before,
.ie7 .sp-thumbnail-arrow:after {
	content: none;
}

.ie8 .sp-top-thumbnails .sp-previous-thumbnail-arrow,
.ie8 .sp-bottom-thumbnails .sp-previous-thumbnail-arrow,
.ie7 .sp-top-thumbnails .sp-previous-thumbnail-arrow,
.ie7 .sp-bottom-thumbnails .sp-previous-thumbnail-arrow {
	border-right: 12px solid #FFF;
	border-top: 12px solid transparent;
	border-bottom: 12px solid transparent;
}

.ie8 .sp-top-thumbnails .sp-next-thumbnail-arrow,
.ie8 .sp-bottom-thumbnails .sp-next-thumbnail-arrow,
.ie7 .sp-top-thumbnails .sp-next-thumbnail-arrow,
.ie7 .sp-bottom-thumbnails .sp-next-thumbnail-arrow {
	border-left: 12px solid #FFF;
	border-top: 12px solid transparent;
	border-bottom: 12px solid transparent;
}

.ie8 .sp-left-thumbnails .sp-previous-thumbnail-arrow,
.ie8 .sp-right-thumbnails .sp-previous-thumbnail-arrow,
.ie7 .sp-left-thumbnails .sp-previous-thumbnail-arrow,
.ie7 .sp-right-thumbnails .sp-previous-thumbnail-arrow {
	border-bottom: 12px solid #FFF;
	border-left: 12px solid transparent;
	border-right: 12px solid transparent;
}

.ie8 .sp-left-thumbnails .sp-next-thumbnail-arrow,
.ie8 .sp-right-thumbnails .sp-next-thumbnail-arrow,
.ie7 .sp-left-thumbnails .sp-next-thumbnail-arrow,
.ie7 .sp-right-thumbnails .sp-next-thumbnail-arrow {
	border-top: 12px solid #FFF;
	border-left: 12px solid transparent;
	border-right: 12px solid transparent;
}

/* Video
--------------------------------------------------*/
a.sp-video {
	text-decoration: none;
}

a.sp-video img {
	-webkit-backface-visibility: hidden;
	border: none;
}

a.sp-video::after {
	content: '\25B6';
	position: absolute;
	width: 45px;
	padding-left: 5px;
	height: 50px;
	border: 2px solid #FFF;
	text-align: center;
	font-size: 30px;
	border-radius: 30px;
	top: 0;
	color: #FFF;
	bottom: 0;
	left: 0;
	right: 0;
	background-color: rgba(0, 0, 0, 0.2);
	margin: auto;
	line-height: 52px;
}

/* CSS for preventing styling issues in WordPress
--------------------------------------------------*/
.slider-pro img.sp-image,
.slider-pro img.sp-thumbnail {
	max-width: none;
	max-height: none;
	border: none !important;
	border-radius: 0 !important;
	padding: 0 !important;
	-webkit-box-shadow: none !important;
	-mox-box-shadow: none !important;
	box-shadow: none !important;
	transition: none;
	-moz-transition: none;
	-webkit-transition: none;
	-o-transition: none;
}

.slider-pro a {
	position: static;
	transition: none !important;
	-moz-transition: none !important;
	-webkit-transition: none !important;
	-o-transition: none !important;
}

.slider-pro iframe,
.slider-pro object,
.slider-pro video,
.slider-pro embed,
.slider-pro canvas {
	max-width: none;
	max-height: none;
}

.slider-pro p.sp-layer {
	font-size: 14px;
	line-height: 1.4;
	margin: 0;
}

.slider-pro h1.sp-layer {
	font-size: 32px;
	line-height: 1.4;
	margin: 0;
}

.slider-pro h2.sp-layer {
	font-size: 24px;
	line-height: 1.4;
	margin: 0;
}

.slider-pro h3.sp-layer {
	font-size: 19px;
	line-height: 1.4;
	margin: 0;
}

.slider-pro h4.sp-layer {
	font-size: 16px;
	line-height: 1.4;
	margin: 0;
}

.slider-pro h5.sp-layer {
	font-size: 13px;
	line-height: 1.4;
	margin: 0;
}

.slider-pro h6.sp-layer {
	font-size: 11px;
	line-height: 1.4;
	margin: 0;
}

.slider-pro img.sp-layer {
	border: none;
}
/*--------------------------------------------------

/*WORKS
-------------------------------------------------------- */
 .boxSizing{ 
	width: 90%;
	margin-left: 5%;
	margin-right: 5%;
	margin-bottom: 10%;
	box-sizing: border-box;
	background-color: #fff;
	position: relative;
 }
 .fadein {
    opacity: 0;
    -webkit-transform: translate(0, 120px);
    transform: translate(0, 120px);
    -webkit-transition: all 1000ms;
    transition: all 1000ms;
}

.fadein.scrollin {
    opacity: 1;
    -webkit-transform: translate(0, 0);
            transform: translate(0, 0);
}

/*WORKS hoverした時zoom
-------------------------------------------------------- */
.scale{ 
    overflow: hidden;
}
.scale img {
    -moz-transition: -moz-transform 0.5s linear;
    -webkit-transition: -webkit-transform 0.5s linear;
    -o-transition: -o-transform 0.5s linear;
    -ms-transition: -ms-transform 0.5s linear;
    transition: transform 0.5s linear;
}
.scale img:hover {
    -webkit-transform: scale(1.2);
    -moz-transform: scale(1.2);
    -o-transform: scale(1.2);
    -ms-transform: scale(1.2);
		transform: scale(1.2);
		background-color: #fff;
}
/*WORKS 色変え
-------------------------------------------------------- */
.waku { 
display:block;
-webkit-filter: grayscale(1);
filter: gray;
filter: grayscale(1);
transition-duration: 1s;
}
.waku:hover{-webkit-filter: grayscale(0);
	filter: none;
	filter: grayscale(0);
}
/* @media screen and (min-width:300px) {  
  .{
    display:flex;
    flex-wrap:nowrap;
    justify-content:space-between;
  }
  .item+.item{
    margin-left:1.0em;
  }
} */
/* 
.change-border01::after,
.change-border01::before,
.change-border01__inner::after,
.change-border01__inner::before {
  background-color: #fff;
  content: '';
  display: block;
  position: absolute;
  z-index: 2;
  transition: all .3s ease;
  -webkit-transition: all .3s ease;
}
.change-border01::after {
    height:2px;
    left:5%;
    top: 5%;
    width: 0px;
}
.change-border01::before {
  bottom: 5%;
  height:2px;
  right: 5%;
  width: 0px;
}
.change-border01__inner::after {
  bottom:5%;
  height: 0px;
  left: 5%;
  width:2px;
}
.change-border01__inner::before {
  height: 0px;
  right:5%;
  top: 5%;
  width:2px;
}

.change-border01:hover::after,
.change-border01:hover::before {
  width: 89.8%;
  width: calc(89.8% + 2px);
  opacity: 0.8;
}
.change-border01:hover .change-border01__inner::after,
.change-border01:hover .change-border01__inner::before {
  height: 89.8%;
  height: calc(89.9% + 2px);
  opacity: 0.8;
}
/*  

 /* .box_img{ 
	width:100%;
	transform: scale(1.1);　
	transition-duration: 1s;
	}
 
 .box_img:hover { 
	width:100%;
	transform: scale(1.2);
	transition-duration: 1s;
	} */

/*instaのbox---------------- */
.box02{
	width: 50%;
}
.flexitem{
  width: 100%;
}
.flexcontainer{
  display: flex;
	justify-content: center;
}
.work_text01{
	  position: absolute;/*絶対配置*/
	  color:#fff;/*文字は白に*/
		top: 250px;
    padding: 5%;
		font-size: 30px;
	  }
.work_text02{
	  position: absolute;/*絶対配置*/
	  color:#fff;/*文字は白に*/
		top: 130px;
    padding: 5%;
		font-size: 30px;
	  }
/*btn
----------------------------------------------- */
/* /* .work_btn { 
  display: inline-block;
  padding: 0.3em 1em;
  text-decoration: none;
 	border: 1px solid #fff;
  transition: .4s;
	color: white;
	background-color:rgba(255,255,255,0);
}

.work_btn:hover {
	background-color:rgba(255,255,255,0);
	text-decoration: none;
}*/

.suisai02::before {
	content: "";
	width: 39%;
	height: 706px;
	/* display: block; */
	background: url(portfolio/back/pro_suisai005.png) no-repeat;
	background-size: cover;
	position: absolute;
	top: -481px;
	left: -270px;
	z-index: 5;
	opacity: 0.7;
	-webkit-transform: translate(0,219px);
	-webkit-transform: translate(0, 120px);
	transform: translate(0, 120px);
	-webkit-transition: all 1000ms;
	transition: all 1000ms;
}

.flexcontainer .suisai02{
	position: relative;
}
/* 
a.buttonMod02 {
	position: relative;
	display: inline-block;
	padding: 43px 10px 0 10px;
	width: 400px;
	height: 94px;
	background: #222;
	background: linear-gradient(45deg, rgba(34,34,34,1), rgba(34,34,34,1), rgba(34,34,34,1));
	color: #FFF;
	font-size: 14px;
	font-family: "Optima", sans-serif;
	font-weight: bold;
	line-height: 1;
	text-align: center;
	text-indent: 0.15em;
	letter-spacing: 0.15em;
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-shadow: 0px 10px 15px 0px rgba(0,0,0,0.2);
	-webkit-box-shadow: 0px 10px 15px 0px rgba(0,0,0,0.2);
	-moz-box-shadow: 0px 10px 15px 0px rgba(0,0,0,0.2);
	z-index: 1;
}
a.buttonMod02:hover {
	background: linear-gradient(45deg, rgba(0,0,255,.9), rgba(255,255,0,.9), rgba(255,0,0,.9));
	background: -webkit-linear-gradient(45deg, rgba(0,0,255,.9), rgba(255,255,0,.9), rgba(255,0,0,.9));
	background-size: 600% 600%;
	animation: AnimeGrade 10s ease infinite;
	text-decoration: none;
	letter-spacing: 0.28em;
	box-shadow: 0px 10px 20px 0px rgba(0,0,0,0.3);
	-webkit-box-shadow: 0px 10px 20px 0px rgba(0,0,0,0.3);
	-moz-box-shadow: 0px 10px 20px 0px rgba(0,0,0,0.3);
}
a.buttonMod02::before {
    content: '';
    position: absolute;
    top: 47px;
    right: 0;
    width: 20px;
    height: 1px;
    background-color: #FFF;
		transition: .2s;
}
a.buttonMod02:hover:before {
	width: 40px;
} */
/*btn
------------------------------------------------- */
/*btn
------------------------------------------------- *
.box p {
  position: absolute;
  top: 50%;
  left: 50%;
  -ms-transform: translate(-50%,-50%);
  -webkit-transform: translate(-50%,-50%);
  transform: translate(-50%,-50%);
  margin:0;
  padding:0;
  /*文字の装飾は省略*/


/*WORKS
-------------------------------------------------------- */
/*PROFILE
-------------------------------------------------------- */
/* indexProfileArea
------------------------------------------ */
.indexProfileArea {
	position: relative;
	padding: 104px 0 200px 0;
	min-width: 1000px;
	background: #FFF;
	z-index: 1;
}   

.indexProfileArea .profileLo01 {
	position: relative;
	display: table;
	width: 100%;
	z-index: 4;
}
.indexProfileArea .profileLo01.suisai03::before{
	content: "";
	width: 42%;
	height: 682px;
	/* display: block; */
	background: url(portfolio/back/pro_suisai07.png) no-repeat; 
	/* background: url(portfolio/back/pro_suisai06.png) no-repeat; */
	background-size: cover;
	position: absolute;
	top: -692px;
	left: 1030px;
	z-index: 5;
	opacity: 0.7;
	-webkit-transform: translate(0,219px);
	-webkit-transform: translate(0, 120px);
	transform: translate(0, 120px);
	-webkit-transition: all 1000ms;
	transition: all 1000ms;
}

.suisai03{
	position: relative;
}
.suisai04::before {
	content: "";
	width: 78%;
	height: 588px;
	/* display: block; */
	background: url(portfolio/back/pro_suisai08.png) no-repeat;
	/* background: url(portfolio/back/pro_suisai06.png) no-repeat; */
	background-size: cover;
	position: absolute;
	top: -384px;
	left: -352px;
	z-index: 5;
	opacity: 0.7;
	-webkit-transform: translate(0,219px);
	-webkit-transform: translate(0, 120px);
	transform: translate(0, 120px);
	-webkit-transition: all 1000ms;
	transition: all 1000ms;
}
.suisai04{
	position: relative;
}
.indexProfileArea .profileLo01 > .block02,
.indexProfileArea .profileLo01 > .block01 {
	display: table-cell;
	vertical-align: top;
}
.indexProfileArea .profileLo01 > .block01 {
	padding-right: 66px;
	width: auto;
}
.indexProfileArea .profileLo01 > .block02 {
	/* padding-top: 85px; */
	padding-top: 32px;
	width: 45.45%;
	max-width: 500px;
}
.indexProfileArea .profileLo01 > .block01 .name01 {
	font-size: 16px;
}
.indexProfileArea .profileLo01 > .block01 .textBlock01 {
	/* margin-top: 50px; */
	padding-right: 70px;
	color: #333;
	font-size: 14px;
	line-height: 1.8;
	letter-spacing: 0.04em;
}
.indexProfileArea .profileLo01 > .block01 .textBlock01 p {
	margin-top: 25px;
}
.indexProfileArea .profileLo01 > .block01 .textBlock01 .profiletext {
	font-size: 24px;
	/* padding-top: 40px; */
}
.indexProfileArea .profileLo01 > .block01 .textBlock01 .profilebox {
	padding-top: 40px;
}

@media screen and (max-width: 767px){
.indexProfileArea .profileLo01 > .block01 .textBlock01 .profiletext {
	font-size: 20px;
	padding-top: 40px;
}
}

.indexProfileArea .profileLo01 > .block01 .textBlock01 p:first-child {
	margin-top: 0;
}
.indexProfileArea .profileLo01 > .block01 .box01 {
	margin-top: 74px;
	margin-left: -130px;
	padding: 70px 130px;
	color: #333;
	font-size: 14px;
	font-family: "Optima", sans-serif;
}
.indexProfileArea .profileLo01 > .block01 .box01 p {
	margin-top: 27px;
}
.indexProfileArea .profileLo01 > .block01 .box01 p:first-child {
	margin-top: 0;
}
.indexProfileArea .profileLo01 > .block02 .photo01 {
	line-height: 0;
}
.indexProfileArea .profileLo01 > .block02 .photo01 img {
	width: 100%;
	height: auto;
}
.indexProfileArea .profileLo01 > .block02 .button01 {
	margin-top: 74px;
	line-height: 0;
	text-align: center;
}

@media screen and (max-width: 767px) {
	.indexProfileArea {
		padding: 70px 0 0 0;
		min-width: 0;
		background: linear-gradient(90deg,#FFF 0%,#FFF 25.1%,#F0F0F0 25.1%,#F0F0F0 100%);
		background: -webkit-linear-gradient(0deg,#FFF 0%,#FFF 25.1%,#F0F0F0 25.1%,#F0F0F0 100%);
}
	.indexProfileArea::before {
		content: " ";
		position: absolute;
		top: 0;
		left: 0;
		display: block;
		width: 100%;
		height: 242px;
		background: #FFF;
		z-index: 2;
	}
	.indexProfileArea .box01Bg {
		display: none;
	}
	.indexProfileArea .headMod01 {
		position: relative;
		z-index: 3;
	}
	.indexProfileArea .profileLo01 {
		margin: 38px 32px 0 32px;
		display: block;
		width: auto;
	}
	.indexProfileArea .profileLo01 > .block02,
	.indexProfileArea .profileLo01 > .block01 {
		display: block;
		vertical-align: baseline;
	}
	.indexProfileArea .profileLo01 > .block01 {
		padding-right: 0;
		width: auto;
	}
	.indexProfileArea .profileLo01 > .block02 {
		padding-top: 20%;
		width: auto;
		max-width: 100%;
	}
}
	.indexProfileArea .profileLo01 > .block01 .name01 {
		font-size: 15px;
	}
	.indexProfileArea .profileLo01 > .block01 .textBlock01 {
		/* margin-top: 46px; */
		padding-right: 0;
		font-size: 13px;
		line-height: 1.95;
	}
	.indexProfileArea .profileLo01 > .block01 .box01 {
		margin: 43px -32px 0 -32px;
		padding: 36px 32px 152px 32px;
		font-size: 13px;
		line-height: 1.9;
		letter-spacing: 0.05em;
	}
	.indexProfileArea .profileLo01 > .block01 .box01 p {
		margin-top: 28px;
	}
	.indexProfileArea .profileLo01 > .block01 .box01 p:first-child {
		margin-top: 0;
	}
	.indexProfileArea .profileLo01 > .block02 .button01 {
		margin-top: 55px;
    text-align: center;
    /* margin: 0 auto; */
	}
	@media screen and (max-width: 767px){
		.indexProfileArea .profileLo01 > .block02 .button01 {
			margin-top: 55px;
			text-align: center;
			/* margin: 0 auto; */
			/* display: flex; */
		}
	}
/*PROFILE
-------------------------------------------------------- */

.profiletext{
	font-size: 22px;
}

.profilebox{
	padding: 20px;
} 

/*insta
-------------------------------------------------------- */

/* .gridContainerinsta{ 
    display: grid;
    grid-template-columns: 16.7% 16.7% 16.7% 16.7% 16.7% 16.7%;
    grid-gap: 10px;
}*/
/* .suisai05:before {
  	content: "";
    width: 51%;
    height: 429px;
    /* display: block;
    background: url(portfolio/back/pro_suisai05.png) no-repeat;
    background-size: cover;
    position: absolute;
    top: 287px;
    left: -247px;
    opacity: 0.9;
    -webkit-transform: translate(0, 114px);
    transform: translate(0, -44px);
    -webkit-transition: all 1000ms;
    transition: all 1000ms;
} */


.gridContainerinsta suisai05{
	position:relative;
}

.simply-scroll-container {
	position: relative;
}
.simply-scroll-clip {
	position: relative;
	overflow: hidden;
}
.simply-scroll-list {
	overflow: hidden;
	margin: 0;
	padding: 0;
}
.simply-scroll-list li {
	float: left; /* Horizontal scroll only */
	padding: 0;
	margin: 0;
	width: 200px;
	height: auto;
}
.simply-scroll-list li img {
	display: block;
	width: 100%;
}
/*insta
-------------------------------------------------------- */

/*nav
-------------------------------------------------------- */
.navArea .navLo01 {
	display: table;
	margin-top: 96px;
	width: 100%;
	color: #333;
	font-family: 'Optima', sans-serif;
	font-weight: bold;
	text-transform: uppercase;
}
.navArea .navLo01 a {
	color: #333;
}
.navArea .navLo01 > dl {
	display: table-cell;
	width: 33.3333%;
	text-align: center;
	vertical-align: top;
}
.navArea .navLo01 > dl > dt {
	font-size: 13px;
	text-indent: 0.23em;
	letter-spacing: 0.23em;
}
.navArea .navLo01 > dl > dd {
	display: table;
	margin-top: 21px;
	width: 100%;
	font-size: 20px;
	text-indent: 0em;
	letter-spacing: 0.1em;
}
.navArea .navLo01 dl li {
	padding: 6px 0;
}

.navArea .navLo01 > dl > dd > .vessel {
	display: table-cell;
	vertical-align: middle;
}
.navArea .navLo01 > dl > dd a:hover {
	text-decoration: none;
	opacity: 0.5;
}
@media screen and (max-width: 767px) {
	.navArea {
		/* padding-top: 85px; */
		display: none;
	}
	.navArea .navLo01 {
		display: block;
		margin-top: 50px;
		width: auto;
	}
	.navArea .navLo01 > dl {
		display: block;
		margin-top: 37px;
		width: auto;
		vertical-align: baseline;
	}
	.navArea .navLo01 > dl:first-child {
		margin-top: 0;
	}
	.navArea .navLo01 > dl:last-child {
		margin-top: 34px;
	}
	.navArea .navLo01 > dl:last-child > dt {
		height: 0;
	}
	.navArea .navLo01 > dl > dd {
		display: block;
		margin-top: 9px;
		width: auto;
	}
	.navArea .navLo01 > dl > dd > .vessel {
		display: block;
		vertical-align: baseline;
	}
	.navArea .navLo01 > dl > dd a:hover {
		opacity: 1;
	}
}

/*nav
-------------------------------------------------------- */

/* Footer
------------------------------------------ */
#footerWrap {
	background: #FFF;
}
#footer {
	padding: 135px 0 203px 0;
}
#footer .scaleMod01 {
	background: #F2F2F2;
	text-align: center;
	height: 300px;
}
.text01_show {
    padding-top: 88px;
    padding-bottom: 140px;
    font-size: 16px;
    text-indent: 0.07em;
    letter-spacing: 0.07em;
}
#footer .text02 {
	margin-top: 30px;
	font-family: 'Optima', sans-serif;
	font-size: 13px;
	text-indent: 0.05em;
	letter-spacing: 0.05em;
}
#footer .button01 {
	position: relative;
	line-height: 0;
}
#footer .button01 .buttonMod01 {
	margin-bottom: -47px;
}
.text{
	padding-top: 260px;
	text-align: center;
	font-size: 13px;
}
.back-to-top {
	position: fixed;
	right: 10px;
	bottom: 10px;
	color: #333;
	width: 40px;
	height: 40px;
	z-index: 2;
	display: none;
}
.back-to-top:before {
	content: "";
	display: block;
	width: 40px;
	height: 40px;
	/* border-radius: 20px; */
	position: absolute;
	left: 0;
	top: 0;
	/* background: #000000; */
}
.back-to-top:after {
	content: "↑";
	display: block;
	text-align: center;
	width: 40px;
	height: 40px;
	line-height: 40px;
	position: absolute;
	left: 0;
	top: 0;
}



@media screen and (max-width: 767px) {
	#footer {
		padding: 75px 0 103px 0;
	}
	#footer .scaleMod01 {
		margin: 0 32px;
	}
	#footer .text01 {
		padding-top: 34px;
		font-size: 12px;
	}
	#footer .text02 {
		margin-top: 15px;
		font-size: 12px;
	}
	#footer .button01 {
		margin: 20px 0 0 0;
		padding-top: 95px;
		display: flex;
    margin: 0 auto;
    text-align: center;
    /* margin-top: 55px; */
    text-align: center;
    /* margin: 0 auto; */
    display: flex;
    left: 0%;
		top: -66%;
		max-width: -webkit-fill-available;
	}
}/* Footer
------------------------------------------ */

/*FLOWER
--------------------------------------------------------
-------------------------------------------------------- */
.indexNewReelArea02{
	padding: 200px 0 112px 0;
	min-width: 1000px;
}

.flower_suisai01{
	position: relative;
}
.flower_suisai01::before {
	content: "";
	width: 37%;
	height: 921px;
	/* display: block; */
	background: url(flower/flower_min/flower_suisai001.png) no-repeat;
	background-size: cover;
	position: absolute;
	top: -234px;
	left: -16px;
	z-index: 0;
	opacity: 0.7;
	-webkit-transform: translate(0,219px);
	-webkit-transform: translate(0, 120px);
	transform: translate(0, 120px);
	-webkit-transition: all 1000ms;
	transition: all 1000ms;
}

.flower_suisai02{
	position: relative;
}
.flower_suisai02::before {
	content: "";
	width: 203%;
	height: 534px;
	background: url(flower/flower_min/flower_suisai03.png) no-repeat;
	background-size: cover;
	position: absolute;
	top: -274px;
	left: 431px;
	z-index: 5;
	opacity: 0.7;
	-webkit-transform: translate(0,219px);
	-webkit-transform: translate(0, 120px);
	transform: translate(0, 120px);
	-webkit-transition: all 1000ms;
	transition: all 1000ms;
}
/* flower グリッドレイアウト--------------- */
.gridContainer_flower{
	display: grid;
  gap: 20px;
	grid-template-columns:1fr 1fr 1fr;
}
/* IE */
.gridContainer_flower{
	display: -ms-grid;
	display: grid;
  gap: 20px;
	-ms-grid-columns:1fr 20px 1fr 20px 1fr;
	grid-template-columns:1fr 1fr 1fr;
}

.flower_box-big1{
	grid-column: 2/3;
  grid-row: 1/3;
}
/* IE */
.flower_box-big1{
	-ms-grid-column: 2;
	-ms-grid-column-span: 1;
	grid-column: 2/3;
  -ms-grid-row: 1;
  -ms-grid-row-span: 2;
  grid-row: 1/3;
}

.flower_box-big2{
	grid-column: 1/2;
  grid-row: 3/5;
}
/* IE */
.flower_box-big2{
	-ms-grid-column: 1;
	-ms-grid-column-span: 1;
	grid-column: 1/2;
  -ms-grid-row: 3;
  -ms-grid-row-span: 2;
  grid-row: 3/5;
}


.flower_box-big3{
	grid-column: 3/4;
  grid-row: 5/7;
}
/* IE */
.flower_box-big3{
	-ms-grid-column: 3;
	-ms-grid-column-span: 1;
	grid-column: 3/4;
  -ms-grid-row: 5;
  -ms-grid-row-span: 2;
  grid-row: 5/7;
}

.flower_box-big4{
	grid-column: 2/3;
  grid-row: 6/8;
}
/* IE */
.flower_box-big4{
	-ms-grid-column: 2;
	-ms-grid-column-span: 1;
	grid-column: 2/3;
  -ms-grid-row: 6;
  -ms-grid-row-span: 2;
  grid-row: 6/8;
}

.flower_box-big5{
	grid-column: 1/3;
  grid-row: 9/11;
}
/* IE */
.flower_box-big5{
	-ms-grid-column: 1;
	-ms-grid-column-span: 2;
	grid-column: 1/3;
  -ms-grid-row: 9;
  -ms-grid-row-span: 2;
  grid-row: 9/11;
}

.gridItem_f02{
	grid-column: 1/2;
	grid-row: 2/3;
}
/* IE */
.gridItem_f02{
	-ms-grid-column: 1;
	-ms-grid-column-span: 1;
	grid-column: 1/2;
	-ms-grid-row: 2;
	-ms-grid-row-span: 1;
	grid-row: 2/3;
}

.gridItem_f03{
	grid-column: 3/4;
	grid-row: 1/2;
}
/* IE */
.gridItem_f03{
	-ms-grid-column: 3;
	-ms-grid-column-span: 1;
	grid-column: 3/4;
	-ms-grid-row: 1;
	-ms-grid-row-span: 1;
	grid-row: 1/2;
}
/* flower グリッドレイアウト--------------- */

body.compensate-for-scrollbar {
	overflow: hidden;
}
/* マスク-------------------------------*/
.mask01{
	width:			100%;
	height:			auto;
	overflow:		hidden;
	/* margin:			10px 8px 10px 16px; */
	position:		relative;	/* 相対位置指定 */
}
.mask01 .caption {
	font-size: 130%;
	text-align: center;
	position: absolute;
	top: 50%;
	left: 50%;
	color: #333;
	margin: 0 auto;
	transform: translateX(-50%) translateY(-50%);
}
.mask01	.mask {
	width:			100%;
	height:			100%;
	position:		absolute;	/* 絶対位置指定 */
	top:			0;
	left:			0;
	opacity:		0;	/* マスクを表示しない */
	background-color:	rgba(252, 250, 250, 0.705);	/* マスクは半透明 */
	-webkit-transition:	all 0.2s ease;
	transition:		all 0.2s ease;
}
.mask01:hover .mask {
	opacity:		1;	/* マスクを表示する */
}
/* scroll up -------------------------------*/
.sa {
  opacity: 0;
  transition: all .5s ease;
}
.sa.show {
  opacity: 1;
  transform: none;
}
.sa--up {
  transform: translate(0, 100px);
}
/* fancybox ---------------------------------------*/
.fancybox-active {
	height: auto;
}

.fancybox-is-hidden {
	left: -9999px;
	margin: 0;
	position: absolute !important;
	top: -9999px;
	visibility: hidden;
}

.fancybox-container {
	-webkit-backface-visibility: hidden;
	height: 100%;
	left: 0;
	outline: none;
	position: fixed;
	-webkit-tap-highlight-color: transparent;
	top: 0;
	-ms-touch-action: manipulation;
	touch-action: manipulation;
	transform: translateZ(0);
	width: 100%;
	z-index: 99992;
}

.fancybox-container * {
	box-sizing: border-box;
}

.fancybox-outer,
.fancybox-inner,
.fancybox-bg,
.fancybox-stage {
	bottom: 0;
	left: 0;
	position: absolute;
	right: 0;
	top: 0;
}

.fancybox-outer {
	-webkit-overflow-scrolling: touch;
	overflow-y: auto;
}

.fancybox-bg {
	background: rgb(30, 30, 30); 
	opacity: 0;
	transition-duration: inherit;
	transition-property: opacity;
	transition-timing-function: cubic-bezier(.47, 0, .74, .71);
}

.fancybox-is-open .fancybox-bg {
	opacity: .9;
	transition-timing-function: cubic-bezier(.22, .61, .36, 1);
}

.fancybox-infobar,
.fancybox-toolbar,
.fancybox-caption,
.fancybox-navigation .fancybox-button {
	direction: ltr;
	opacity: 0;
	position: absolute;
	transition: opacity .25s ease, visibility 0s ease .25s;
	visibility: hidden;
	z-index: 99997;
}

.fancybox-show-infobar .fancybox-infobar,
.fancybox-show-toolbar .fancybox-toolbar,
.fancybox-show-caption .fancybox-caption,
.fancybox-show-nav .fancybox-navigation .fancybox-button {
	opacity: 1;
	transition: opacity .25s ease 0s, visibility 0s ease 0s;
	visibility: visible;
}

.fancybox-infobar {
	color: #ccc;
	font-size: 13px;
	-webkit-font-smoothing: subpixel-antialiased;
	height: 44px;
	left: 0;
	line-height: 44px;
	min-width: 44px;
	mix-blend-mode: difference;
	padding: 0 10px;
	pointer-events: none;
	top: 0;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

.fancybox-toolbar {
	right: 0;
	top: 0;
}

.fancybox-stage {
	direction: ltr;
	overflow: visible;
	transform: translateZ(0);
	z-index: 99994;
}

.fancybox-is-open .fancybox-stage {
	overflow: hidden;
}

.fancybox-slide {
	-webkit-backface-visibility: hidden;
	/* Using without prefix would break IE11 */
	display: none;
	height: 100%;
	left: 0;
	outline: none;
	overflow: auto;
	-webkit-overflow-scrolling: touch;
	padding: 44px;
	position: absolute;
	text-align: center;
	top: 0;
	transition-property: transform, opacity;
	white-space: normal;
	width: 100%;
	z-index: 99994;
}

.fancybox-slide::before {
	content: '';
	display: inline-block;
	font-size: 0;
	height: 100%;
	vertical-align: middle;
	width: 0;
}

.fancybox-is-sliding .fancybox-slide,
.fancybox-slide--previous,
.fancybox-slide--current,
.fancybox-slide--next {
	display: block;
}

.fancybox-slide--image {
	overflow: hidden;
	padding: 44px 0;
}

.fancybox-slide--image::before {
	display: none;
}

.fancybox-slide--html {
	padding: 6px;
}

.fancybox-content {
	background: #fff;
	display: inline-block;
	margin: 0;
	max-width: 100%;
	overflow: auto;
	-webkit-overflow-scrolling: touch;
	padding: 44px;
	position: relative;
	text-align: left;
	vertical-align: middle;
}

.fancybox-slide--image .fancybox-content {
	animation-timing-function: cubic-bezier(.5, 0, .14, 1);
	-webkit-backface-visibility: hidden;
	background: transparent;
	background-repeat: no-repeat;
	background-size: 100% 100%;
	left: 0;
	max-width: none;
	overflow: visible;
	padding: 0;
	position: absolute;
	top: 0;
	-ms-transform-origin: top left;
	transform-origin: top left;
	transition-property: transform, opacity;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	z-index: 99995;
}

.fancybox-can-zoomOut .fancybox-content {
	cursor: zoom-out;
}

.fancybox-can-zoomIn .fancybox-content {
	cursor: zoom-in;
}

.fancybox-can-swipe .fancybox-content,
.fancybox-can-pan .fancybox-content {
	cursor: -webkit-grab;
	cursor: grab;
}

.fancybox-is-grabbing .fancybox-content {
	cursor: -webkit-grabbing;
	cursor: grabbing;
}

.fancybox-container [data-selectable='true'] {
	cursor: text;
}

.fancybox-image,
.fancybox-spaceball {
	background: transparent;
	border: 0;
	height: 100%;
	left: 0;
	margin: 0;
	max-height: none;
	max-width: none;
	padding: 0;
	position: absolute;
	top: 0;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	width: 100%;
}

.fancybox-spaceball {
	z-index: 1;
}

.fancybox-slide--video .fancybox-content,
.fancybox-slide--map .fancybox-content,
.fancybox-slide--pdf .fancybox-content,
.fancybox-slide--iframe .fancybox-content {
	height: 100%;
	overflow: visible;
	padding: 0;
	width: 100%;
}

.fancybox-slide--video .fancybox-content {
	background: #000;
}

.fancybox-slide--map .fancybox-content {
	background: #e5e3df;
}

.fancybox-slide--iframe .fancybox-content {
	background: #fff;
}

.fancybox-video,
.fancybox-iframe {
	background: transparent;
	border: 0;
	display: block;
	height: 100%;
	margin: 0;
	overflow: hidden;
	padding: 0;
	width: 100%;
}

/* Fix iOS */
.fancybox-iframe {
	left: 0;
	position: absolute;
	top: 0;
}

.fancybox-error {
	background: #fff;
	cursor: default;
	max-width: 400px;
	padding: 40px;
	width: 100%;
}

.fancybox-error p {
	color: #444;
	font-size: 16px;
	line-height: 20px;
	margin: 0;
	padding: 0;
}

/* Buttons */

.fancybox-button {
	background: rgba(30, 30, 30, .6);
	border: 0;
	border-radius: 0;
	box-shadow: none;
	cursor: pointer;
	display: inline-block;
	height: 44px;
	margin: 0;
	padding: 10px;
	position: relative;
	transition: color .2s;
	vertical-align: top;
	visibility: inherit;
	width: 44px;
}

.fancybox-button,
.fancybox-button:visited,
.fancybox-button:link {
	color: #ccc;
}

.fancybox-button:hover {
	color: #fff;
}

.fancybox-button:focus {
	outline: none;
}

.fancybox-button.fancybox-focus {
	outline: 1px dotted;
}

.fancybox-button[disabled],
.fancybox-button[disabled]:hover {
	color: #888;
	cursor: default;
	outline: none;
}

/* Fix IE11 */
.fancybox-button div {
	height: 100%;
}

.fancybox-button svg {
	display: block;
	height: 100%;
	overflow: visible;
	position: relative;
	width: 100%;
}

.fancybox-button svg path {
	fill: currentColor;
	stroke-width: 0;
}

.fancybox-button--play svg:nth-child(2),
.fancybox-button--fsenter svg:nth-child(2) {
	display: none;
}

.fancybox-button--pause svg:nth-child(1),
.fancybox-button--fsexit svg:nth-child(1) {
	display: none;
}

.fancybox-progress {
	background: #ff5268;
	height: 2px;
	left: 0;
	position: absolute;
	right: 0;
	top: 0;
	-ms-transform: scaleX(0);
	transform: scaleX(0);
	-ms-transform-origin: 0;
	transform-origin: 0;
	transition-property: transform;
	transition-timing-function: linear;
	z-index: 99998;
}

/* Close button on the top right corner of html content */

.fancybox-close-small {
	background: transparent;
	border: 0;
	border-radius: 0;
	color: #ccc;
	cursor: pointer;
	opacity: .8;
	padding: 8px;
	position: absolute;
	right: -12px;
	top: -44px;
	z-index: 401;
}

.fancybox-close-small:hover {
	color: #fff;
	opacity: 1;
}

.fancybox-slide--html .fancybox-close-small {
	color: currentColor;
	padding: 10px;
	right: 0;
	top: 0;
}

.fancybox-slide--image.fancybox-is-scaling .fancybox-content {
	overflow: hidden;
}

.fancybox-is-scaling .fancybox-close-small,
.fancybox-is-zoomable.fancybox-can-pan .fancybox-close-small {
	display: none;
}

/* Navigation arrows */

.fancybox-navigation .fancybox-button {
	background-clip: content-box;
	height: 100px;
	opacity: 0;
	position: absolute;
	top: calc(50% - 50px);
	width: 70px;
}

.fancybox-navigation .fancybox-button div {
	padding: 7px;
}

.fancybox-navigation .fancybox-button--arrow_left {
	left: 0;
	left: env(safe-area-inset-left);
	padding: 31px 26px 31px 6px;
}

.fancybox-navigation .fancybox-button--arrow_right {
	padding: 31px 6px 31px 26px;
	right: 0;
	right: env(safe-area-inset-right);
}

/* Caption */

.fancybox-caption {
	background: linear-gradient(to top,
			rgba(0, 0, 0, .85) 0%,
			rgba(0, 0, 0, .3) 50%,
			rgba(0, 0, 0, .15) 65%,
			rgba(0, 0, 0, .075) 75.5%,
			rgba(0, 0, 0, .037) 82.85%,
			rgba(0, 0, 0, .019) 88%,
			rgba(0, 0, 0, 0) 100%);
	bottom: 0;
	color: #eee;
	font-size: 14px;
	font-weight: 400;
	left: 0;
	line-height: 1.5;
	padding: 75px 44px 25px 44px;
	pointer-events: none;
	right: 0;
	text-align: center;
	z-index: 99996;
}

@supports (padding: max(0px)) {
	.fancybox-caption {
			padding: 75px max(44px, env(safe-area-inset-right)) max(25px, env(safe-area-inset-bottom)) max(44px, env(safe-area-inset-left));
	}
}

.fancybox-caption--separate {
	margin-top: -50px;
}

.fancybox-caption__body {
	max-height: 50vh;
	overflow: auto;
	pointer-events: all;
}

.fancybox-caption a,
.fancybox-caption a:link,
.fancybox-caption a:visited {
	color: #ccc;
	text-decoration: none;
}

.fancybox-caption a:hover {
	color: #fff;
	text-decoration: underline;
}

/* Loading indicator */

.fancybox-loading {
	animation: fancybox-rotate 1s linear infinite;
	background: transparent;
	border: 4px solid #888;
	border-bottom-color: #fff;
	border-radius: 50%;
	height: 50px;
	left: 50%;
	margin: -25px 0 0 -25px;
	opacity: .7;
	padding: 0;
	position: absolute;
	top: 50%;
	width: 50px;
	z-index: 99999;
}

@keyframes fancybox-rotate {
	100% {
			transform: rotate(360deg);
	}
}

/* Transition effects */

.fancybox-animated {
	transition-timing-function: cubic-bezier(0, 0, .25, 1);
}

/* transitionEffect: slide */

.fancybox-fx-slide.fancybox-slide--previous {
	opacity: 0;
	transform: translate3d(-100%, 0, 0);
}

.fancybox-fx-slide.fancybox-slide--next {
	opacity: 0;
	transform: translate3d(100%, 0, 0);
}

.fancybox-fx-slide.fancybox-slide--current {
	opacity: 1;
	transform: translate3d(0, 0, 0);
}

/* transitionEffect: fade */

.fancybox-fx-fade.fancybox-slide--previous,
.fancybox-fx-fade.fancybox-slide--next {
	opacity: 0;
	transition-timing-function: cubic-bezier(.19, 1, .22, 1);
}

.fancybox-fx-fade.fancybox-slide--current {
	opacity: 1;
}

/* transitionEffect: zoom-in-out */

.fancybox-fx-zoom-in-out.fancybox-slide--previous {
	opacity: 0;
	transform: scale3d(1.5, 1.5, 1.5);
}

.fancybox-fx-zoom-in-out.fancybox-slide--next {
	opacity: 0;
	transform: scale3d(.5, .5, .5);
}

.fancybox-fx-zoom-in-out.fancybox-slide--current {
	opacity: 1;
	transform: scale3d(1, 1, 1);
}

/* transitionEffect: rotate */

.fancybox-fx-rotate.fancybox-slide--previous {
	opacity: 0;
	-ms-transform: rotate(-360deg);
	transform: rotate(-360deg);
}

.fancybox-fx-rotate.fancybox-slide--next {
	opacity: 0;
	-ms-transform: rotate(360deg);
	transform: rotate(360deg);
}

.fancybox-fx-rotate.fancybox-slide--current {
	opacity: 1;
	-ms-transform: rotate(0deg);
	transform: rotate(0deg);
}

/* transitionEffect: circular */

.fancybox-fx-circular.fancybox-slide--previous {
	opacity: 0;
	transform: scale3d(0, 0, 0) translate3d(-100%, 0, 0);
}

.fancybox-fx-circular.fancybox-slide--next {
	opacity: 0;
	transform: scale3d(0, 0, 0) translate3d(100%, 0, 0);
}

.fancybox-fx-circular.fancybox-slide--current {
	opacity: 1;
	transform: scale3d(1, 1, 1) translate3d(0, 0, 0);
}

/* transitionEffect: tube */

.fancybox-fx-tube.fancybox-slide--previous {
	transform: translate3d(-100%, 0, 0) scale(.1) skew(-10deg);
}

.fancybox-fx-tube.fancybox-slide--next {
	transform: translate3d(100%, 0, 0) scale(.1) skew(10deg);
}

.fancybox-fx-tube.fancybox-slide--current {
	transform: translate3d(0, 0, 0) scale(1);
}

/* Styling for Small-Screen Devices */
@media all and (max-height: 576px) {
	.fancybox-slide {
			padding-left: 6px;
			padding-right: 6px;
	}

	.fancybox-slide--image {
			padding: 6px 0;
	}

	.fancybox-close-small {
			right: -6px;
	}

	.fancybox-slide--image .fancybox-close-small {
			background: #4e4e4e;
			color: #f2f4f6;
			height: 36px;
			opacity: 1;
			padding: 6px;
			right: 0;
			top: 0;
			width: 36px;
	}

	.fancybox-caption {
			padding-left: 12px;
			padding-right: 12px;
	}

	@supports (padding: max(0px)) {
			.fancybox-caption {
					padding-left: max(12px, env(safe-area-inset-left));
					padding-right: max(12px, env(safe-area-inset-right));
			}
	}
}
/* Share */

.fancybox-share {
	background: #f4f4f4;
	border-radius: 3px;
	max-width: 90%;
	padding: 30px;
	text-align: center;
}

.fancybox-share h1 {
	color: #222;
	font-size: 35px;
	font-weight: 700;
	margin: 0 0 20px 0;
}

.fancybox-share p {
	margin: 0;
	padding: 0;
}

.fancybox-share__button {
	border: 0;
	border-radius: 3px;
	display: inline-block;
	font-size: 14px;
	font-weight: 700;
	line-height: 40px;
	margin: 0 5px 10px 5px;
	min-width: 130px;
	padding: 0 15px;
	text-decoration: none;
	transition: all .2s;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	white-space: nowrap;
}

.fancybox-share__button:visited,
.fancybox-share__button:link {
	color: #fff;
}

.fancybox-share__button:hover {
	text-decoration: none;
}

.fancybox-share__button--fb {
	background: #3b5998;
}

.fancybox-share__button--fb:hover {
	background: #344e86;
}

.fancybox-share__button--pt {
	background: #bd081d;
}

.fancybox-share__button--pt:hover {
	background: #aa0719;
}

.fancybox-share__button--tw {
	background: #1da1f2;
}

.fancybox-share__button--tw:hover {
	background: #0d95e8;
}

.fancybox-share__button svg {
	height: 25px;
	margin-right: 7px;
	position: relative;
	top: -1px;
	vertical-align: middle;
	width: 25px;
}

.fancybox-share__button svg path {
	fill: #fff;
}

.fancybox-share__input {
	background: transparent;
	border: 0;
	border-bottom: 1px solid #d7d7d7;
	border-radius: 0;
	color: #5d5b5b;
	font-size: 14px;
	margin: 10px 0 0 0;
	outline: none;
	padding: 10px 15px;
	width: 100%;
}
/* Thumbs */

.fancybox-thumbs {
	background: #ddd;
	bottom: 0;
	display: none;
	margin: 0;
	-webkit-overflow-scrolling: touch;
	-ms-overflow-style: -ms-autohiding-scrollbar;
	padding: 2px 2px 4px 2px;
	position: absolute;
	right: 0;
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
	top: 0;
	width: 212px;
	z-index: 99995;
}

.fancybox-thumbs-x {
	overflow-x: auto;
	overflow-y: hidden;
}

.fancybox-show-thumbs .fancybox-thumbs {
	display: block;
}

.fancybox-show-thumbs .fancybox-inner {
	right: 212px;
}

.fancybox-thumbs__list {
	font-size: 0;
	height: 100%;
	list-style: none;
	margin: 0;
	overflow-x: hidden;
	overflow-y: auto;
	padding: 0;
	position: absolute;
	position: relative;
	white-space: nowrap;
	width: 100%;
}

.fancybox-thumbs-x .fancybox-thumbs__list {
	overflow: hidden;
}

.fancybox-thumbs-y .fancybox-thumbs__list::-webkit-scrollbar {
	width: 7px;
}

.fancybox-thumbs-y .fancybox-thumbs__list::-webkit-scrollbar-track {
	background: #fff;
	border-radius: 10px;
	box-shadow: inset 0 0 6px rgba(0, 0, 0, .3);
}

.fancybox-thumbs-y .fancybox-thumbs__list::-webkit-scrollbar-thumb {
	background: #2a2a2a;
	border-radius: 10px;
}

.fancybox-thumbs__list a {
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	background-color: rgba(0, 0, 0, .1);
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
	cursor: pointer;
	float: left;
	height: 75px;
	margin: 2px;
	max-height: calc(100% - 8px);
	max-width: calc(50% - 4px);
	outline: none;
	overflow: hidden;
	padding: 0;
	position: relative;
	-webkit-tap-highlight-color: transparent;
	width: 100px;
}

.fancybox-thumbs__list a::before {
	border: 6px solid #ff5268;
	bottom: 0;
	content: '';
	left: 0;
	opacity: 0;
	position: absolute;
	right: 0;
	top: 0;
	transition: all .2s cubic-bezier(.25, .46, .45, .94);
	z-index: 99991;
}

.fancybox-thumbs__list a:focus::before {
	opacity: .5;
}

.fancybox-thumbs__list a.fancybox-thumbs-active::before {
	opacity: 1;
}

/* Styling for Small-Screen Devices
@media all and (max-width: 576px) {
	.fancybox-thumbs {
			width: 110px;
	}

	.fancybox-show-thumbs .fancybox-inner {
			right: 110px;
	}

	.fancybox-thumbs__list a {
			max-width: calc(100% - 10px);
	}
} */
/*fancybox
-------------------------------------------------------- *

/*FLOWER
-------------------------------------------------------- *
/*DROWING
--------------------------------------------------------
-------------------------------------------------------- */
.drawing_suisai01{
	position: relative;
}
.drawing_suisai01::before {
	content: "";
	width: 45%;
	height: 478px;
	/* display: block; */
	background: url(drawing/drawing_min/dr_suisai01.png) no-repeat;
	background-size: cover;
	position: absolute;
	top: -234px;
	left: 947px;
	z-index: 5;
	opacity: 0.7;
	-webkit-transform: translate(0,219px);
	-webkit-transform: translate(0, 120px);
	transform: translate(0, 120px);
	-webkit-transition: all 1000ms;
	transition: all 1000ms;
}

.drawing_suisai02{
	position: relative;
}
.drawing_suisai02::before {
	content: "";
	width: 256%;
	height: 171px;
	background: url(drawing/drawing_min/dr_suisai02.png) no-repeat;
	background-size: cover;
	position: absolute;
	top: 6px;
	left: -733px;
	z-index: 5;
	opacity: 0.7;
	-webkit-transform: translate(0,219px);
	-webkit-transform: translate(0, 120px);
	transform: translate(0, 120px);
	-webkit-transition: all 1000ms;
	transition: all 1000ms;
}
/* drawing　グリッドレイアウト----------------------  */
.gridContainer_drowing{
	display: grid;
  gap: 20px;
	grid-template-columns:1fr 1fr 1fr;
}
/* IE */
.gridContainer_drowing{
	display: -ms-grid;
	display: grid;
  gap: 20px;
	-ms-grid-columns:1fr 20px 1fr 20px 1fr;
	grid-template-columns:1fr 1fr 1fr;
}

.drowing_box-big1{
	grid-column: 2/4;
  grid-row: 1/3;
}
/* IE */
.drowing_box-big1{
	-ms-grid-column: 2;
	-ms-grid-column-span: 2;
	grid-column: 2/4;
  -ms-grid-row: 1;
  -ms-grid-row-span: 2;
  grid-row: 1/3;
}

.drowing_box-big2{
	grid-column: 1/2;
  grid-row: 3/5;
}
/* IE */
.drowing_box-big2{
	-ms-grid-column: 1;
	-ms-grid-column-span: 1;
	grid-column: 1/2;
  -ms-grid-row: 3;
  -ms-grid-row-span: 2;
  grid-row: 3/5;
}

.drowing_box-big3{
	grid-column: 1/3;
  grid-row: 5/7;
}
/* IE */
.drowing_box-big3{
	-ms-grid-column: 1;
	-ms-grid-column-span: 2;
	grid-column: 1/3;
  -ms-grid-row: 5;
  -ms-grid-row-span: 2;
  grid-row: 5/7;
}

.drowing_box-big4{
	grid-column: 3/4;
  grid-row: 7/9;
}
/* IE */
.drowing_box-big4{
	-ms-grid-column: 3;
	-ms-grid-column-span: 1;
	grid-column: 3/4;
  -ms-grid-row: 7;
  -ms-grid-row-span: 2;
  grid-row: 7/9;
}

.drowing_box-big5{
	grid-column: 1/3;
  grid-row: 9/11;
}
/* IE */
.drowing_box-big5{
	-ms-grid-column: 1;
	-ms-grid-column-span: 2;
	grid-column: 1/3;
  -ms-grid-row: 9;
  -ms-grid-row-span: 2;
  grid-row: 9/11;
}

.drowing_box-big6{
	grid-column: 1/2;
  grid-row: 11/13;
}
/* IE */
.drowing_box-big6{
	-ms-grid-column: 1;
	-ms-grid-column-span: 1;
	grid-column: 1/2;
  -ms-grid-row: 11;
  -ms-grid-row-span: 2;
  grid-row: 11/13;
}
/*DROWING
-------------------------------------------------------- */
/*DROWING
--------------------------------------------------------
-------------------------------------------------------- */
.picture_suisai01{
	position: relative;
}
	.picture_suisai01::before {
    content: "";
    width: 32%;
    height: 311px;
    background: url(picture/picture_min/picture_suisai01.png) no-repeat;
    background-size: cover;
    position: absolute;
    top: -94px;
    left: 124px;
    z-index: 0;
    opacity: 0.9;
    -webkit-transform: translate(0,219px);
    -webkit-transform: translate(0, 120px);
    transform: translate(0, 120px);
    -webkit-transition: all 1000ms;
    transition: all 1000ms;
}
.picture_suisai02{
	position: relative;
}
.picture_suisai02::before {
	content: "";
	width: 329%;
	height: 534px;
	background: url(picture/picture_min/picture_suisai02.png) no-repeat;
	background-size: cover;
	position: absolute;
	top: -294px;
	left: 311px;
	z-index: 5;
	opacity: 0.7;
	-webkit-transform: translate(0,219px);
	-webkit-transform: translate(0, 120px);
	transform: translate(0, 120px);
	-webkit-transition: all 1000ms;
	transition: all 1000ms;
}
/* picture グリッドレイアウト-------------------- */
.gridContainer_picture{
	display: grid;
  gap: 20px;
	grid-template-columns:1fr 1fr 1fr;
}
/* IE */
.gridContainer_picture{
	display: -ms-grid;
	display: grid;
  gap: 20px;
	-ms-grid-columns:1fr 20px 1fr 20px 1fr;
	grid-template-columns:1fr 1fr 1fr;
}

.picture_box-big1{
	grid-column: 2/3;
  grid-row: 1/3;
}
/* IE */
.picture_box-big1{
	-ms-grid-column: 2;
	-ms-grid-column-span: 1;
	grid-column: 2/3;
  -ms-grid-row: 1;
  -ms-grid-row-span: 2;
  grid-row: 1/3;
}

.picture_box-big2{
	grid-column: 1/3;
  grid-row: 3/6;
}
/* IE */
.picture_box-big2{
	-ms-grid-column: 1;
	-ms-grid-column-span: 2;
	grid-column: 1/3;
  -ms-grid-row: 3;
  -ms-grid-row-span: 3;
  grid-row: 3/6;
}

.picture_box-big3{
	grid-column: 3/4;
  grid-row: 5/7;
}
/* IE */
.picture_box-big3{
	-ms-grid-column: 3;
	-ms-grid-column-span: 1;
	grid-column: 3/4;
  -ms-grid-row: 5;
  -ms-grid-row-span: 2;
  grid-row: 5/7;
}

.picture_box-big4{
	grid-column: 2/4;
  grid-row: 7/9;
}
/* IE */
.picture_box-big4{
	-ms-grid-column: 2;
	-ms-grid-column-span: 2;
	grid-column: 2/4;
  -ms-grid-row: 7;
  -ms-grid-row-span: 2;
  grid-row: 7/9;
}

.picture_box-big5{
	grid-column: 1/3;
  grid-row: 9/12;
}
/* IE */
.picture_box-big5{
	-ms-grid-column: 1;
	-ms-grid-column-span: 2;
	grid-column: 1/3;
  -ms-grid-row: 9;
  -ms-grid-row-span: 3;
  grid-row: 9/12;
}

.picture_box-big6{
	grid-column: 2/4;
  grid-row: 12/14;
}
/* IE */
.picture_box-big6{
	-ms-grid-column: 2;
	-ms-grid-column-span: 2;
	grid-column: 2/4;
  -ms-grid-row: 12;
  -ms-grid-row-span: 2;
  grid-row: 12/14;
}

.gridItem_pic02{
  grid-column: 1/2;
  grid-row: 2/3;
}
/* IE */
.gridItem_pic02{
  -ms-grid-column: 1;
  -ms-grid-column-span: 1;
  grid-column: 1/2;
  -ms-grid-row: 2;
  -ms-grid-row-span: 1;
  grid-row: 2/3;
}

.gridItem_pic04{
	grid-column: 3/4;
  grid-row: 1/2;
}
/* IE */
.gridItem_pic04{
	-ms-grid-column: 3;
	-ms-grid-column-span: 1;
	grid-column: 3/4;
  -ms-grid-row: 1;
  -ms-grid-row-span: 1;
  grid-row: 1/2;
}

.gridItem_pic05{
	grid-column: 3/4;
  grid-row: 2/3;
}
/* IE */
.gridItem_pic05{
	-ms-grid-column: 3;
	-ms-grid-column-span: 1;
	grid-column: 3/4;
  -ms-grid-row: 2;
  -ms-grid-row-span: 1;
  grid-row: 2/3;
}

.gridItem_pic07{
	grid-column: 3/4;
  grid-row: 3/4;
}
/* IE */
.gridItem_pic07{
	-ms-grid-column: 3;
	-ms-grid-column-span: 1;
	grid-column: 3/4;
  -ms-grid-row: 3;
  -ms-grid-row-span: 1;
  grid-row: 3/4;
}

.gridItem_pic08{
	grid-column: 3/4;
  grid-row: 4/5;
}
/* IE */
.gridItem_pic08{
	-ms-grid-column: 3;
	-ms-grid-column-span: 1;
	grid-column: 3/4;
  -ms-grid-row: 4;
  -ms-grid-row-span: 1;
  grid-row: 4/5;
}

.gridItem_pic09{
	grid-column: 3/4;
  grid-row: 5/7;
}
/* IE */
.gridItem_pic09{
	-ms-grid-column: 3;
	-ms-grid-column-span: 1;
	grid-column: 3/4;
  -ms-grid-row: 5;
  -ms-grid-row-span: 2;
  grid-row: 5/7;
}

.gridItem_pic10{
	grid-column: 1/2;
  grid-row: 6/7;
}
/* IE */
.gridItem_pic10{
	-ms-grid-column: 1;
	-ms-grid-column-span: 1;
	grid-column: 1/2;
  -ms-grid-row: 6;
  -ms-grid-row-span: 1;
  grid-row: 6/7;
}

.gridItem_pic11{
	grid-column: 2/3;
  grid-row: 6/7;
}
/* IE */
.gridItem_pic11{
	-ms-grid-column: 2;
	-ms-grid-column-span: 1;
	grid-column: 2/3;
  -ms-grid-row: 6;
  -ms-grid-row-span: 1;
  grid-row: 6/7;
}

.gridItem_pic12{
	grid-column: 1/2;
  grid-row: 7/8;
}
/* IE */
.gridItem_pic12{
	-ms-grid-column: 1;
	-ms-grid-column-span: 1;
	grid-column: 1/2;
  -ms-grid-row: 7;
  -ms-grid-row-span: 1;
  grid-row: 7/8;
}

.gridItem_pic13{
	grid-column: 1/2;
  grid-row: 8/9;
}
/* IE */
.gridItem_pic13{
	-ms-grid-column: 1;
	-ms-grid-column-span: 1;
	grid-column: 1/2;
  -ms-grid-row: 8;
  -ms-grid-row-span: 1;
  grid-row: 8/9;
}
/*PRODUCT 
--------------------------------------------------------
-------------------------------------------------------- */
.design_suisai01{
	position: relative;
}
.design_suisai01::before {
	content: "";
	width: 38%;
	height: 523px;
	background: url(design/design_min/design_suisai02.png) no-repeat;
	background-size: cover;
	position: absolute;
	top: -127px;
	left: 41px;
	z-index: 5;
	opacity: 0.7;
	-webkit-transform: translate(0,219px);
	-webkit-transform: translate(0, 120px);
	transform: translate(0, 120px);
	-webkit-transition: all 1000ms;
	transition: all 1000ms;
}
.design_suisai02{
	position: relative;
}
.design_suisai02::before {
	content: "";
	width: 329%;
	height: 534px;
	background: url(design/design_min/design_suisai01.png) no-repeat;
	background-size: cover;
	position: absolute;
	top: -294px;
	left: 311px;
	z-index: 5;
	opacity: 0.7;
	-webkit-transform: translate(0,219px);
	-webkit-transform: translate(0, 120px);
	transform: translate(0, 120px);
	-webkit-transition: all 1000ms;
	transition: all 1000ms;
}
/* product グリッドレイアウト-------------------- */
.gridContainer_product{
	display: grid;
	grid-template-columns: 33.3% 33.3% 33.3%;
	grid-gap: 20px;
}
/* IE */
.gridContainer_product{
	display: -ms-grid;
	display: grid;
	-ms-grid-columns: 33.3% 20px 33.3% 20px 33.3%;
	grid-template-columns: 33.3% 33.3% 33.3%;
	grid-gap: 20px;
}
/*スマホ
--------------------------------------------------------
-------------------------------------------------------- */
@media screen and (max-width:767px) {
	.suisai01::before{
		content: none;
	}
	}
	@media screen and (max-width: 767px){
		#header .logo01 {
				position: absolute;
				top: 50%;
				left: 53%;
				width: 70%;
				margin: -15% 0px 0 -51%;
				color: #FFF;
				font-size: 10vw;
				/* font-family: 'Optima', sans-serif; */
				font-weight: 700;
				line-height: 1.6;
				text-align: center;
				text-indent: 1.2em;
				/* letter-spacing: 0.2em; */
				z-index: 4;
		}
}
@media screen and (max-width: 767px){
.indexAboutArea .aboutBox01 {
	margin: 0 auto;
	/* display: block; */
	text-align: center;
	margin-left: -13%;
	width: -6%;
	padding: 12%;
}
}
@media screen and (max-width: 767px){
.indexNewReelArea{
	padding: 91px 0 100px 0;
	min-width:auto;
	}
} 
@media screen and (max-width: 767px){
.indexNewReelArea .h2 {
	text-align: center;
	font-size: 24vw;
	padding-bottom: 88px;
	padding-left: -325%;
	display: flex;
	margin: 0 auto;
	padding-left: 4%;
	padding-top: 88px;
	font-size: 20px;
}
}
@media screen and (max-width: 767px){
	.indexAboutArea{
		padding: 91px 0 100px 0;
		min-width:auto;
		}
	} 
@media screen and (max-width: 767px){
	.flexcontainer {
		flex-direction: column;
	}
	}	
	@media screen and (max-width: 767px){
	#header .scaleMod01::before {
    content:"";
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg,rgba(0,0,0,0.7) 0%,rgba(0,0,0,0.7) 50%,rgba(238,238,238,0.79) 50%,rgba(238,238,238,0.79) 100%);
    background: -webkit-linear-gradient(0deg,rgba(11, 228, 239, 0.18) 0%,rgba(143, 203, 247, 0.48) 50%,rgba(238,238,238,0.79) 50%,rgba(238,238,238,0.79) 100%);
    opacity: .9;
    transition: .6s;
		z-index: 3;
	}
	}
	@media screen and (max-width: 767px) {
		.indexAboutArea {
			min-width: 0;
		}
		.indexAboutArea .aboutBox01 {
			margin: -38px 16px 0 16px;
			padding: 43px 10px 85px 10px;
			width: auto;
			font-size: 11px;
		}
		.indexAboutArea .aboutBox01 .textBlock01 {
			line-height: 1.9;
			text-indent: 0.02em;
			letter-spacing: 0.02em;
		}
		.indexAboutArea .aboutBox01 .textBlock02 {
			margin-top: 10px;
			line-height: 1.9;
			text-indent: 0.04em;
			letter-spacing: 0.04em;
		}
		.indexAboutArea .button01 {
			margin-top: 24px;
		}
		.button01 a.buttonMod01 {
			padding-top: 27px;
			width: 220px;
			height: 65px;
			font-size: 14px;
		}
	
	@media screen and (max-width: 767px){
.button01 a.buttonMod01::before {
    width: 220px;
    height: 65px;
    top: 0;
    background-color: transparent;
	}
}
	/* @media screen and (max-width: 767px){
		.indexAboutArea .button01 {
			margin-top: 55px;
			text-align: center;
	}
} */


	@media screen and (max-width: 767px) {
		.headMod01 {
			margin: 0 32px;
			font-size: 22px;
			letter-spacing: 0.2em;
		}
		.headMod01 > span > .line01::before {
			content: " ";
			width: 25px;
			height: 2px;
		}
	}
	@media screen and (max-width: 767px) {
		.subMod01 {
			font-size: 10px;
			letter-spacing: 0.23em;
		}
	}
	@media screen and (max-width: 767px) {
		.headMod02 {
			margin-top: -2px;
			font-size: 20px;
			line-height: 1.3;
			margin-bottom: 30px;
		}
		.subMod01 + .headMod02 {
			margin-top: 17px;
		}
		.headMod02 > span {
			padding-right: 0;
		}
		.headMod02 > span > .line01 {
			display: none;
		}
	}
}
	@media screen and (max-width: 767px) {
	.work_text02 {
		font-size: 20px;
		top: 82px;
	}
	.work_text01{
	font-size: 20px;
	top: 165px;
	}
	}
/* ポートフォリオ１P 水彩------------------------------------ */
@media screen and (max-width: 767px){
.suisai02::before {
    content: "";
    width: 64%;
    height: 319px;
    background: url(portfolio/back/pro_suisai005.png) no-repeat;
    background-size: cover;
    position: absolute;
    top: -358px;
    left: 0px;
    z-index: 0;
    opacity: 0.7;
    -webkit-transform: translate(0,219px);
    -webkit-transform: translate(0, 120px);
    transform: translate(0, 120px);
    -webkit-transition: all 1000ms;
    transition: all 1000ms;
}
}
	@media screen and (max-width: 767px) {
	.indexProfileArea .profileLo01.suisai03::before {
    content: "";
    width: 40%;
    height: 400px;
    background: url(portfolio/back/pro_suisai07.png) no-repeat;
    background-size: cover;
    position: absolute;
    top: -422px;
    left: 549px;
    z-index: 5;
    opacity: 0.7;
    -webkit-transform: translate(0,219px);
    -webkit-transform: translate(0, 120px);
    transform: translate(0, 120px);
    -webkit-transition: all 1000ms;
    transition: all 1000ms;
}
	}
	/* @media screen and (min-width: 1501px){
		.suisai04::before {
    content: "";
    width: 90%;
    height: 310px;
    background: url(portfolio/back/pro_suisai08.png) no-repeat;
    background-size: cover;
    position: absolute;
    top: -65px;
    left: -115px;
    z-index: 5;
    opacity: 0.7;
    -webkit-transform: translate(0,219px);
    -webkit-transform: translate(0, 120px);
    transform: translate(0, 120px);
    -webkit-transition: all 1000ms;
    transition: all 1000ms;
} 
	}*/
	@media screen and (max-width: 767px){
.indexProfileArea .profileLo01.suisai03::before {
		content: "";
		width: 81%;
		height: 327px;
		background: url(portfolio/back/pro_suisai07.png) no-repeat;
		background-size: cover;
		position: absolute;
		top: -274px;
		left: 70px;
		z-index: 5;
		opacity: 0.7;
		-webkit-transform: translate(0,219px);
		-webkit-transform: translate(0, 120px);
		transform: translate(0, 120px);
		-webkit-transition: all 1000ms;
		transition: all 1000ms;
	}
}
@media screen and (max-width: 767px){
	.suisai04::before {
			content: "";
			width: 80%;
			height: 266px;
			background: url(portfolio/back/pro_suisai08.png) no-repeat;
			background-size: cover;
			position: absolute;
			top: 24px;
			left: 80px;
			z-index: 5;
			opacity: 0.5;
			-webkit-transform: translate(0,219px);
			-webkit-transform: translate(0, 120px);
			transform: translate(0, 120px);
			-webkit-transition: all 1000ms;
			transition: all 1000ms;
}
}
/* ポートフォリオ１P pro 水彩------------------------------------ */
	/* @media screen and (min-width: 1501px){
		.suisai02::before {
			content: "";
			width: 37%;
			height: 390px;
			background: url(portfolio/back/pro_suisai005.png) no-repeat;
			background-size: cover;
			position: absolute;
			top: -349px;
			left: -39px;
			z-index: 5;
			opacity: 0.7;
			-webkit-transform: translate(0,219px);
			-webkit-transform: translate(0, 120px);
			transform: translate(0, 120px);
			-webkit-transition: all 1000ms;
			transition: all 1000ms;
	}
}
@media screen and (min-width: 1501px){
	.indexProfileArea .profileLo01.suisai03::before {
    content: "";
    width: 40%;
    height: 400px;
    background: url(portfolio/back/pro_suisai07.png) no-repeat;
    background-size: cover;
    position: absolute;
    top: -422px;
    left: 549px;
    z-index: 5;
    opacity: 0.7;
    -webkit-transform: translate(0,219px);
    -webkit-transform: translate(0, 120px);
    transform: translate(0, 120px);
    -webkit-transition: all 1000ms;
    transition: all 1000ms;
}
	}
	{
		@media screen and (min-width: 1501px){
		.suisai04::before {
    content: "";
    width: 90%;
    height: 310px;
    background: url(portfolio/back/pro_suisai08.png) no-repeat;
    background-size: cover;
    position: absolute;
    top: -65px;
    left: -115px;
    z-index: 5;
    opacity: 0.7;
    -webkit-transform: translate(0,219px);
    -webkit-transform: translate(0, 120px);
    transform: translate(0, 120px);
    -webkit-transition: all 1000ms;
    transition: all 1000ms;
}
	} 
	 */
	 /* @media screen and (max-width: 767px){ 
		.gridContainer_drowing {
			display: grid;
			gap: 20px;
			grid-template-columns: 1fr 1fr 1fr;
			width: 90%;
	}
}
/* ポートフォリオ１P 水彩------------------------------------ */
/* ポートフォリオ１P 水彩 ipad ------------------------------------ */
/* .flower_suisai01::before {
	content: "";
	width: 47%;
	height: 765px;
	background: url(flower/flower_min/flower_suisai001.png) no-repeat;
	background-size: cover;
	position: absolute;
	top: -202px;
	left: -116px;
	z-index: 5;
	opacity: 0.7;
	-webkit-transform: translate(0,219px);
	-webkit-transform: translate(0, 120px);
	transform: translate(0, 120px);
	-webkit-transition: all 1000ms;
	transition: all 1000ms;
} 
.flower_suisai02::before {
	content: "";
	width: 168%;
	height: 534px;
	background: url(flower/flower_min/flower_suisai03.png) no-repeat;
	background-size: cover;
	position: absolute;
	top: -254px;
	left: 207px;
	z-index: 5;
	opacity: 0.7;
	-webkit-transform: translate(0,219px);
	-webkit-transform: translate(0, 120px);
	transform: translate(0, 120px);
	-webkit-transition: all 1000ms;
	transition: all 1000ms;
}
.drowing_suisai02::before {
	content: "";
	width: 251%;
	height: 172px;
	background: url(drowing/drowing_min/drsuisai_top03.png) no-repeat;
	background-size: cover;
	position: absolute;
	top: 6px;
	left: -607px;
	z-index: 5;
	opacity: 0.7;
	-webkit-transform: translate(0,219px);
	-webkit-transform: translate(0, 120px);
	transform: translate(0, 120px);
	-webkit-transition: all 1000ms;
	transition: all 1000ms;
}
.picture_suisai01::before {
    content: "";
    width: 33%;
    height: 418px;
    background: url(picture/picture_min/picture_suisai01.png) no-repeat;
    background-size: cover;
    position: absolute;
    top: -114px;
    left: 44px;
    z-index: 0;
    opacity: 0.7;
    -webkit-transform: translate(0,219px);
    -webkit-transform: translate(0, 120px);
    transform: translate(0, 120px);
    -webkit-transition: all 1000ms;
    transition: all 1000ms;
}
.picture_suisai02::before {
    content: "";
    width: 196%;
    height: 327px;
    background: url(picture/picture_min/picture_suisai03.png) no-repeat;
    background-size: cover;
    position: absolute;
    top: -168px;
    left: 241px;
    z-index: 5;
    opacity: 0.7;
    -webkit-transform: translate(0,219px);
    -webkit-transform: translate(0, 120px);
    transform: translate(0, 120px);
    -webkit-transition: all 1000ms;
    transition: all 1000ms;
}

.drowing_suisai01::before {
	content: "";
	width: 64%;
	height: 459px;
	background: url(drowing/drowing_min/drsuisai_top01.png) no-repeat;
	background-size: cover;
	position: absolute;
	top: -234px;
	left: 378px;
	z-index: 5;
	opacity: 0.7;
	-webkit-transform: translate(0,219px);
	-webkit-transform: translate(0, 120px);
	transform: translate(0, 120px);
	-webkit-transition: all 1000ms;
	transition: all 1000ms;
}
.design_suisai01::before {
    content: "";
    width: 53%;
    height: 395px;
    background: url(design/design_min/design_suisai02.png) no-repeat;
    background-size: cover;
    position: absolute;
    top: -127px;
    left: -8px;
    z-index: 5;
    opacity: 0.7;
    -webkit-transform: translate(0,219px);
    -webkit-transform: translate(0, 120px);
    transform: translate(0, 120px);
    -webkit-transition: all 1000ms;
    transition: all 1000ms;
}
*/

@media screen and (max-width: 767px){
.flower_suisai01::before {
	content: "";
	width: 55%;
	height: 332px;
	/* display: block; */
	background: url(flower/flower_min/flower_suisai001.png) no-repeat;
	background-size: cover;
	position: absolute;
	top: -113px;
	left: -51px;
	z-index: 5;
	opacity: 0.7;
	-webkit-transform: translate(0,219px);
	-webkit-transform: translate(0, 120px);
	transform: translate(0, 120px);
	-webkit-transition: all 1000ms;
	transition: all 1000ms;
}
@media screen and (max-width: 767px){
}
.flower_suisai02::before {
	content: "";
	width: 139%;
	height: 193px;
	background: url(flower/flower_min/flower_suisai03.png) no-repeat;
	background-size: cover;
	position: absolute;
	top: -48px;
	left: 103px;
	z-index: 5;
	opacity: 0.7;
	-webkit-transform: translate(0,219px);
	-webkit-transform: translate(0, 120px);
	transform: translate(0, 120px);
	-webkit-transition: all 1000ms;
	transition: all 1000ms;
}
}
@media screen and (max-width: 767px){
.drawing_suisai01::before {
    content: "";
    width: 85%;
    height: 202px;
    background: url(drawing/drawing_min/dr_suisai01.png) no-repeat;
    background-size: cover;
    position: absolute;
    top: -93px;
    left: 80px;
    z-index: -2;
    opacity: 0.7;
    -webkit-transform: translate(0,219px);
    -webkit-transform: translate(0, 120px);
    transform: translate(0, 120px);
    -webkit-transition: all 1000ms;
    transition: all 1000ms;
}
}

@media screen and (max-width: 767px){
.drawing_suisai02::before {
	width: 175%;
    height: 60px;
    background: url(drawing/drawing_min/dr_suisai02.png) no-repeat;
    background-size: cover;
    position: absolute;
    top: -4px;
    left: -154px;
    z-index: 5;
    opacity: 0.7;
    -webkit-transform: translate(0,219px);
    -webkit-transform: translate(0, 120px);
    transform: translate(0, 120px);
    -webkit-transition: all 1000ms;
    transition: all 1000ms;
}
}
	@media screen and (max-width: 767px){
	.picture_suisai01::before {
			content: "";
			width: 58%;
			height: 145px;
			background: url(picture/picture_min/picture_suisai01.png) no-repeat;
			background-size: cover;
			position: absolute;
			top: -93px;
			left: 4px;
			z-index: 0;
			opacity: 0.7;
			-webkit-transform: translate(0,219px);
			-webkit-transform: translate(0, 120px);
			transform: translate(0, 120px);
			-webkit-transition: all 1000ms;
			transition: all 1000ms;
	}
}
	@media screen and (max-width: 767px){
	.picture_suisai02::before {
			content: "";
			width: 165%;
			height: 152px;
			background: url(picture/picture_min/picture_suisai02.png) no-repeat;
			background-size: cover;
			position: absolute;
			top: -22px;
			left: 45px;
			z-index: 5;
			opacity: 0.7;
			-webkit-transform: translate(0,219px);
			-webkit-transform: translate(0, 120px);
			transform: translate(0, 120px);
			-webkit-transition: all 1000ms;
			transition: all 1000ms;
	}
}
@media screen and (max-width: 767px){
.design_suisai01::before {
  content: "";
    width: 76%;
    height: 210px;
    background: url(design/design_min/design_suisai02.png) no-repeat;
    background-size: cover;
    position: absolute;
    top: 121px;
    left: -8px;
    z-index: 5;
    opacity: 0.7;
    -webkit-transform: translate(0,219px);
    -webkit-transform: translate(0, 120px);
    transform: translate(0, 120px);
    -webkit-transition: all 1000ms;
    transition: all 1000ms;
}
}
@media screen and (max-width: 767px){
.design_suisai02::before {
	content: "";
	width: 197%;
	height: 217px;
	background: url(design/design_min/design_suisai01.png) no-repeat;
	background-size: cover;
	position: absolute;
	top: -343px;
	left: 44px;
	z-index: 5;
	opacity: 0.7;
	-webkit-transform: translate(0,219px);
	-webkit-transform: translate(0, 120px);
	transform: translate(0, 120px);
	-webkit-transition: all 1000ms;
	transition: all 1000ms;
}
}
@media screen and (max-width: 767px){
.indexNewReelArea02 {
	min-width: auto;
}
}
@media screen and (max-width: 767px){
	.gridContainer_flower {
		gap: 10px;
	}
}
@media screen and (max-width: 767px){
	.gridContainer_drowing {
		gap: 10px;
	}
}
@media screen and (max-width: 767px){
	.gridContainer_picture{
		gap: 10px;
	}
}
@media screen and (max-width: 767px){
	.gridContainer_picture{
		gap: 10px;
	}
}
@media screen and (max-width: 767px){
#demo-1{
	overflow: hidden;
    width: 100%;
		height: 100vh;
    background-color: #999;
    position: relative;
}
}
@media screen and (max-width: 767px){
.gridContainer_product{
	display: -ms-grid;
	display: grid;
	grid-template-columns: 25% 25% 25%;
	grid-gap: 10px;
	justify-content: center;
}
}
@media screen and (max-width: 767px){
#windowBox {
    height: 100vh;
}
}