@charset "UTF-8";
/**====================================
 * CSS information
 * file name	: common.css
 * author		: libretto works
====================================**/

@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@100..900&family=Zen+Kaku+Gothic+New:wght@400;500;700&display=swap');

/* body
-------------------------------------------------- */
html {
	font-size: 62.5%;
}
body {
	font-size: 1.7em;
	line-height: 1.9;
	position: relative;
	font-family: "Zen Kaku Gothic New", sans-serif;
	font-weight: 500;
	letter-spacing: 0.08em;
	color: #1a1a1a;
	width: 100%;
	min-width: 1120px;
	height: 100%;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale; 
	background: #FFFFFF;
    transition: .3s;
}
body.fixed {
    position: fixed;
    width: 100%;
    height: 100%;
    left: 0;
}
body.fade {
    opacity: 0;
}

/* link
-------------------------------------------------- */
a {
	color: #1a1a1a;
	text-decoration: none;
	transition: all .2s;
}
a._underline {
	text-decoration: underline;
}
@media screen and (min-width: 768px) {
	a:hover {
		opacity: 0.7;
	}
	a.btn-cont:hover {
		opacity: 1;
	}
}

/* clear
-------------------------------------------------- */
.clear:after {
	height: 0;
	visibility: hidden;
	content: ".";
	display: block;
	clear: both;
}

/* font
-------------------------------------------------- */
._en {
	font-family: "Montserrat", sans-serif;
    font-optical-sizing: auto;
    font-weight: 500;
    font-style: normal;
}
._ja {
	font-family: "Zen Kaku Gothic New", sans-serif;
	font-weight: 500;
}

/* Responsive
-------------------------------------------------- */
.sp {
	display: none;
}

/* img
-------------------------------------------------- */
img {
	width: 100%;
	height: auto;
}
.thumb {
	display: block;
	overflow: hidden;
	position: relative;
	transition: .3s all;
}
.thumb::after {
	display: block;
	content: "";
}
.thumb.overlay::after {
	position: relative;
	background: rgba(0,0,0,0.20);
}
.thumb img,
.thumb video{
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: .3s all;
}

@media screen and (min-width: 768px) {
a:hover .thumb {
	transform: scale(0.96);
}
a:hover .thumb img {
	width: 115%;
	height: 115%;
	object-fit: cover;
}
}

/* bg
-------------------------------------------------- */
._bg {
    background: #f1f2ed;
}

/* align
-------------------------------------------------- */
._alignC {
    text-align: center;
}
._alignR {
    text-align: right;
}
.sup {
    display: inline-block;
    font-size: 75%;
    transform: translateY(-20%);
}
/* svg
-------------------------------------------------- */
svg {
	display: block;
	width: 100%;
	height: auto;
}

/* cursor
-------------------------------------------------- */
.cursor,
.follower {
	border-radius: 50%;
	position: fixed;
	top: 0;
	left: 0;
	pointer-events: none;
	transition: transform ease .2s;
}
.cursor {
	width: 12px;
	height: 12px;
	background-color: rgba(42,44,46,0.60);
	z-index: 999999;
}
.follower {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 40px;
	height: 40px;
	border: 1px solid rgba(86,99,112,0.40);
	z-index: 99999;
	text-align: center;
	mix-blend-mode: multiply;
	opacity: 0;
}
.cursor.is-active {
	transform: scale(1.2);
}
.follower.is-active {
	transform: scale(2.4);
	border: 1px solid rgba(42,44,46,0.00);
	background: rgba(86,99,112,0.30);
}
.motion .follower {
	animation: fade .2s forwards 1s;
}


/*/////////////////////////////////////////////////////////////////////////////


              // loading //
	  

/////////////////////////////////////////////////////////////////////////////*/
.loader {
	width: 100%;
	height: 100vh;
	position: fixed;
	left: 0;
	top: 0;
	z-index: 999999;
	pointer-events: none;
}
.off.loader {
	animation: loading-bg-off 0.8s forwards;
}
.loader-bg {
	display: block;
	width: 100%;
	height: 100%;
	position: fixed;
	bottom: 0;
	right: 0;
	background: #FFFFFF;
	transform-origin: right top;
}
.loader-logo {
	width: 210px;
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%,-50%);
	text-align: center;
	overflow: hidden;
}
.loader-logo p {
	transform: translateY(110%);
}
.on.loader .loader-logo p {
    transition: transform 0.55s cubic-bezier(0.76, 0.09, 0.215, 1);
    transform: translateY(0);
}
.off.loader .loader-logo {
    transition: opacity 0.3s .3s;
    opacity: 0;
}

@keyframes op-logo {
	0% {
		transform: translateY(110%);
	}
	100% {
		transform: translateY(0);
	}
}
@keyframes loading-bg-off {
	0% {
		opacity: 1;
	}
	100% {
		opacity: 0;
	}
}


/*/////////////////////////////////////////////////////////////////////////////


              // layout //
	  

/////////////////////////////////////////////////////////////////////////////*/

/* container
-------------------------------------------------- */
 #container {
	width: 100%;
	opacity: 1;
}
.motion  #container {
	animation: fade 0.2s  forwards;
}
 #container._bd {
	 border-bottom: 1px solid #d9d9d9;
}

/* section
-------------------------------------------------- */
.section-wrap {
    padding-bottom: 140px;
}
.section-inner {
	box-sizing: border-box;
    padding-right: 5.8565%;
	padding-left: 5.8565%;
}
.section-inner._0-80 {
    padding-right: 0;
}
.section-inner._80-0 {
    padding-left: 0;
}
.section-low-wrap {
	width: 920px;
	margin: 0 auto;
}
.section-low-inner {
	margin-top: 30px;
}
.flex-col2 {
    display: flex;
    justify-content: space-between;
}

/*/////////////////////////////////////////////////////////////////////////////


              // header //
	  

/////////////////////////////////////////////////////////////////////////////*/

/* header
-------------------------------------------------- */
.header {
	width: 100%;
	position: relative;
}
.header-logo {
	width: 153px;
	position: absolute;
	left: 2.9282%;
	top: 40px;
	box-sizing: border-box;
	z-index: 99998;
}
.header-logo a {
	display: block;
}
.header-logo svg {
	display: block;
}
.st0,
.st1 {
    fill: #ffffff;
}
.sub .st0,
.footer .st0 {
    fill: #1453a1;
}
.sub .st1,
.footer .st1 {
    fill: #4aa2df;
}
.open .st0,
.open .st1 {
    fill: #ffffff;
}

/* nav
-------------------------------------------------- */
.header-inner {
    width: 100%;
	position: absolute;
	right: 0;
	top: 49px;
    padding: 0 2.9282%;
	z-index: 99997;
    box-sizing: border-box;
}
.g-nav {
    position: relative;
}
.g-nav a {
	color: #FFFFFF;
    font-size: 1.5rem;
}
.sub .g-nav a {
	color: #1a1a1a;
}
.g-nav ul {
    display: flex;
    justify-content: center;
}
.g-nav li {
	margin: 0 12px;
	transform: translateY(20px);
	opacity: 0;
}
.g-nav li a {
	display: block;
	position: relative;
	line-height: 34px;
}
.g-nav li a::before {
	content: "";
	width: 100%;
	height: 1px;
	background: #FFFFFF;
	position: absolute;
	left: 0;
	bottom: 0;
	transform: scaleX(0);
	transition: .2s;
}
.sub .g-nav li a::before {
	background: #1a1a1a;
}
.g-nav-contact {
    position: absolute;
    top: 0;
    right: 90px;
	opacity: 0;
}
.g-nav-contact a {
	display: block;
	width: 150px;
	line-height: 36px;
	box-sizing: border-box;
	border: 1px solid #FFFFFF;
	text-align: center;
    border-radius: calc(infinity * 1px);
}
.sub .g-nav-contact a {
	border: 1px solid #666666;
}
.g-nav li.ac a::before {
	transform: scaleX(1);
}

.motion .g-nav li:nth-child(1) {
	animation: nav-fadeup 0.4s cubic-bezier(0.02, 0.95, 0.4, 1) forwards 0.5s;
}
.motion .g-nav li:nth-child(2) {
	animation: nav-fadeup 0.4s cubic-bezier(0.02, 0.95, 0.4, 1) forwards 0.6s;
}
.motion .g-nav li:nth-child(3) {
	animation: nav-fadeup 0.4s cubic-bezier(0.02, 0.95, 0.4, 1) forwards 0.7s;
}
.motion .g-nav li:nth-child(4) {
	animation: nav-fadeup 0.4s cubic-bezier(0.02, 0.95, 0.4, 1) forwards 0.8s;
}
.motion .g-nav li:nth-child(5) {
	animation: nav-fadeup 0.4s cubic-bezier(0.02, 0.95, 0.4, 1) forwards 0.9s;
}
.motion .g-nav li:nth-child(6) {
	animation: nav-fadeup 0.4s cubic-bezier(0.02, 0.95, 0.4, 1) forwards 1.0s;
}
.motion .g-nav li:nth-child(7) {
	animation: nav-fadeup 0.4s cubic-bezier(0.02, 0.95, 0.4, 1) forwards 1.1s;
}
.motion .g-nav-contact {
	animation: fade 0.4s forwards 1.3s;
}
@keyframes nav-fadeup {
	0% {
		transform: translateY(20px);
		opacity: 0;
	}
	100% {
		transform: translateY(0px);
		opacity: 1;
	}
}

/* hover */
@media screen and (min-width: 768px) {
	.g-nav li a:hover {
		opacity: 1;
	}
	.g-nav li a:hover::before {
		transform: scaleX(1);
	}
}

@media screen and (max-width: 1179px) {
	.g-nav li {
		margin: 0 10px;
	}
}

/* dd-nav-btn
-------------------------------------------------- */
.g-nav .dd-nav-btn > a {
    position: relative;
    padding-right: 15px;
}
.g-nav .dd-nav-btn > a::after {
    content: "";
    background: #ffffff;
    height: 7px;
    width: 8px;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-30%);
    clip-path: polygon(0 0, 100% 0, 50% 100%);
}
.sub .g-nav .dd-nav-btn > a::after {
    background: #1a1a1a;
}
.g-nav .g-nav-sublist {
    display: block;
    width: 240px;
    position: absolute;
    left: -10px;
    top: 46px;
    padding: 30px 20px 10px;
    box-sizing: border-box;
    pointer-events: none;
	transition: .3s;
    box-shadow: #97a4aa66 3px 10px 20px -10px;
    opacity: 0;
}
.g-nav .g-nav-sublist::before {
    content: "";
    width: 100%;
    height: calc(100% - 20px);
    background: #ffffff;
    position: absolute;
    left: 0;
    top: 20px;
}
.g-nav .g-nav-sublist li {
    float: none;
    box-sizing: border-box;
    margin-bottom: 10px;
    margin: 0;
    border-bottom: 1px solid #d9d9d9;
}
.g-nav .g-nav-sublist li:last-child {
    border-bottom: none;
}
.g-nav .g-nav-sublist li a {
    font-size: 1.4rem;
    line-height: 1.5;
    padding: 13px 0;
    color: #1a1a1a;
}
.g-nav .g-nav-sublist li a p {
    width: calc(100% - 95px);
}
.g-nav .g-nav-sublist li a::before {
    display: none;
}

/* hover */
@media screen and (min-width: 768px) {
	.dd-nav-btn:hover > .g-nav-sublist {
		top: 30px;
		opacity: 1;
		pointer-events: auto;
	}
}


/* menu-trigger
-------------------------------------------------- */
.menu-trigger,
.menu-trigger span {
	display: block;
	transition: all .3s;
	box-sizing: border-box;
}
.menu-trigger {
	width: 50px;
	height: 36px;
	pointer-events: auto;
	cursor: pointer;
	position: fixed;
	right: 2.9282%;
	top: 49px;
    z-index: 999999;
	box-sizing: border-box;
}
.on .menu-trigger,
.sub .menu-trigger,
.open .menu-trigger{
    mix-blend-mode: difference;
}
.menu-trigger span {
	position: absolute;
	left: 0;
	width: 100%;
	height: 1px;
	background: #ffffff;
}
.menu-trigger span:nth-of-type(1) {
	top: 9px;
}
.menu-trigger span:nth-of-type(2) {
	bottom: 9px;
}
.open .menu-trigger span:nth-of-type(1) {
	top: 18px;
    transform: rotate(30deg);
}
.open .menu-trigger span:nth-of-type(2) {
    bottom: 17px;
    transform: rotate(-30deg);
}

/* fixed nav
-------------------------------------------------- */
.fixed-nav {
	position: fixed;
	left: 0;
	top: 0;
	width: 100vw;
	height: 100vh;
	background: #FFFFFF;
	transition: all .3s;
	z-index: 99998;
	line-height: 2;
	opacity: 0;
	pointer-events: none;
}
.open .fixed-nav {
	opacity: 1;
	pointer-events: auto;
}
.fixed-nav .header-logo {
	position: fixed;
	z-index: 99999;
}
.fixed-nav__img {
	width: 40%;
	height: 100vh;
	position: absolute;
	top: 0;
	left: 0;
}
.fixed-inner {
	width: 60%;
	height: 100vh;
	box-sizing: border-box;
	overflow: scroll;
	-webkit-overflow-scrolling: touch;
	overflow-scrolling: touch;
	position: relative;
	margin-left: 40%;
}
.fixed-nav .m-nav {
	font-size: 1.4rem;
	line-height: 1.5;
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	width: 100%;
	padding: 0 4% 0 12%;
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
    box-sizing: border-box;
}
.fixed-nav .m-nav li.m-nav__item {
	width: 48%;
	overflow: hidden;
	margin: 0 0 30px;
}
.fixed-nav .m-nav li.m-nav-col1 {
	width: 100%;
}
.fixed-nav .m-nav li.m-nav__item > a {
	display: inline-block;
	position: relative;
}
.fixed-nav .m-nav li.m-nav__item > a ._en {
	display: block;
	font-size: 3.2rem;
    font-weight: 600;
	transition: .2s;
	line-height: 1.3;
    margin-top: 2px;
}
.fixed-nav .m-nav-inr {
	display: flex;
	justify-content: flex-start;
	flex-wrap: wrap;
	padding-top: 15px;
}
.fixed-nav .m-nav-inr li {
	margin: 0 15px 10px 0;
	padding-right: 22px;
	font-size: 1.6rem;
	position: relative;
}
.fixed-nav .m-nav-inr li::after {
	content: "/";
	display: block;
	position: absolute;
	right: 0;
	top: 0;
}
.fixed-nav .m-nav-sublist {
	display: flex;
	align-items: center;
	margin-top: 20px;
}
.fixed-nav .m-nav__subitem a {
	text-decoration: underline;
}

@-webkit-keyframes fixed-navup {
	0% {
		opacity: 0;
		transform:translateX(20px);
	}
	100% {
		opacity:1;
		transform:translateX(0);
	}
}
@keyframes fixed-navup {
	0% {
		opacity: 0;
		transform:translateX(20px);
	}
	100% {
		opacity:1;
		transform:translateX(0);
	}
}

@media screen and (min-width: 768px) {

}
@media screen and (max-height: 710px) {
	.fixed-nav .m-nav {
		padding: 80px 4% 80px 12%;
		position: static;
		transform: none;
	}
}

/*/////////////////////////////////////////////////////////////////////////////


              // footer //
	  

/////////////////////////////////////////////////////////////////////////////*/
.footer {
	padding: 80px 5.8565% 40px;
	position: relative;
}
.footer-inner {
	position: relative;
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	flex-wrap: wrap;
	margin-bottom: 25px;
	border-bottom: 1px solid #d9d9d9;
	padding-bottom: 60px;
}

/* ft-info
-------------------------------------------------- */
.ft-info {
    width: 380px;
}
.ft-logo {
	width: 180px;
	margin-bottom: 25px;
}
.ft-info dt {
    font-size: 1.6rem;
}
.ft-info dd {
    font-size: 1.5rem;
    line-height: 1.75;
    margin-bottom: 4px;
}

/* ft-nav
-------------------------------------------------- */
.ft-nav {
	width: calc(100% - 380px);
	display: flex;
	justify-content: flex-end;
}
.ft-nav ul.ft-nav-wrap {
	margin-left: 7%;
}
.ft-nav ul.ft-nav-wrap > li {
    font-size: 1.6rem;
	margin-bottom: 8px;
}
.ft-nav .ft-nav-inner {
	margin-top: 8px;
}
.ft-nav .ft-nav-inner li > a {
	font-size: 1.4rem;
}

/* footer-btm
-------------------------------------------------- */
.footer-btm {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
}
.ft-iso {
    display: flex;
    justify-content: flex-start;
    align-items: center;
}
.ft-iso .mark {
    width: 100px;
    margin-right: 22px;
}
.ft-iso .txt {
    font-size: 1.2rem;
    line-height: 1.5;
}
.ft-iso .txt span {
    display: block;
    font-size: 1.0rem;
    margin-top: 2px;
}
.ft-btm {
    text-align: right;
    font-size: 1.3rem;
}
.ft-btm p {
    margin-top: 10px;
}
.copyright {
	font-size: 1.2rem;
    letter-spacing: 0.04em;
}


/*/////////////////////////////////////////////////////////////////////////////


              // ctaArea //
	  

/////////////////////////////////////////////////////////////////////////////*/
.ctaArea {
    display: flex;
    justify-content: space-between;
    align-items: center;
	background: url("../images/cv_img.jpg") center center no-repeat;
	background-size: cover;
    padding: 130px 5.8565%;
    position: relative;
    color: #ffffff;
}
.ctaArea::before {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background: rgba(42,44,46,0.85);
}
.ctaArea-ttl {
    width: 410px;
    position: relative;
}
.ctaArea-ttl .txt {
    margin-top: 20px;
}
.ctaArea-list {
    width: calc( 97.8441% - 410px);
    display: flex;
    justify-content: space-between;
    position: relative;
}
.ctaArea-list li {
    width: 46.7532%;
    text-align: center;
    padding: 60px 0 70px;
    border-top: 1px solid rgba(255,255,255,0.80);
    border-bottom: 1px solid rgba(255,255,255,0.80);
}
.ctaArea-list li .ttl {
    font-size: 2.0rem;
    font-weight: 700;
    margin-bottom: 40px;
}
.ctaArea-list a {
    display: block;
    color: #ffffff;
}
.ctaArea-list a.tel ._en {
    font-size: 3.8rem;
    font-weight: 600;
    line-height: 1.1;
    margin-bottom: 5px;
}
.ctaArea-list a.tel ._en span {
    font-size: 2.0rem;
}
.ctaArea-list a.tel .txt {
    font-size: 1.6rem;
}
.ctaArea-list a.mail {
    max-width: 340px;
    border: 1px solid #ffffff;
    border-radius: calc(infinity * 1px);
    line-height: 78px;
    margin: auto;
}
.ctaArea-list a.mail p {
    display: inline-block;
    background: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="28" height="22" viewBox="0 0 28 22"><path fill-rule="evenodd" fill="rgb(255, 255, 255)" d="M14,15.1L5,7.7l.6-.8,8.3,6.9,8.3-6.9.6.8-9,7.4ZM27,1H1v20h26V1M28,0v22H0V0h28Z"/></svg>') no-repeat center left;
    background-size: 28px auto;
    padding-left: 44px;
}

/* hover */
@media screen and (min-width: 768px) {
	.cv-area a:hover {
		background: rgba(42,44,46,0.3);
	}
}

/*/////////////////////////////////////////////////////////////////////////////


              // common parts //
	  

/////////////////////////////////////////////////////////////////////////////*/

/* ===============================================
    title
=============================================== */

/* page-ttl
-------------------------------------------------- */
.page-ttl {
    padding: 220px 0 110px;
}
.page-ttl-inner {
    padding: 0 5.8565%;
    align-items: flex-end;
    position: relative;
}
.page-ttl-cont .ttl {
    display: inline-block;
    font-size: 1.8rem;
    background: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="14" height="14" viewBox="0 0 14 14"><path fill-rule="evenodd" fill="rgb(74, 162, 223)" d="M13.779,0.012 C6.175,0.539 0.255,6.460 0.005,13.784 L-0.001,13.998 L14.010,13.998 L14.010,-0.004 L13.779,0.012 Z"/></svg>') no-repeat center left;
    background-size: 16px 16px;
    padding: 0 0 0 18px;
    opacity: 0;
    transition: 1s 0.2s;
}
.motion .page-ttl .ttl {
    opacity: 1;
}
.page-ttl-cont .enttl {
    font-size: 9.8rem;
    font-weight: 600;
    line-height: 1.3;
}
.page-ttl-cont .enttl span {
    display: block;
    transform: translateY(30%);
    opacity: 0;
    filter: blur(6px);
}
.motion .page-ttl-cont .enttl span {
    transition: 1s cubic-bezier(0.76, 0.09, 0.215, 1) 0.1s;
    transform: translateY(0);
    opacity: 1;
    filter: blur(0);
}
.page-ttl-cont .jattl {
    font-size: 5.8rem;
    line-height: 1.5;
    padding: 15px 0 30px;
}
.page-ttl-cont .jattl span {
    display: block;
    transform: translateY(30%);
    opacity: 0;
    filter: blur(6px);
}
.motion .page-ttl-cont .jattl span {
    transition: 1s cubic-bezier(0.76, 0.09, 0.215, 1) 0.1s;
    transform: translateY(0);
    opacity: 1;
    filter: blur(0);
}
.page-ttl-cont._news .jattl {
    font-size: 4.8rem;
}
.page-ttl .page-lead {
    width: 47.7611%;
    font-size: 1.8rem;
    line-height: 1.75;
}
.page-ttl-cont._news .news-info {
    margin-bottom: 50px;
}
.page-ttl-cont._news {
    border-bottom: 1px solid #999999;
    padding-bottom: 35px;
}

/* page-ttl-col2
-------------------------------------------------- */
.page-ttl-col2 {
    display: flex;
    justify-content: space-between;
    align-items: stretch;
    margin-top: 70px;
}
.page-ttl-col2-fig {
    width: 39.5314%;
    min-height: 580px;
}
.page-ttl-col2-cont {
    width: 53.1478%;
    padding: 25px 5.8565% 70px 0;
    box-sizing: border-box;
}
.page-ttl-col2-cont-txt {
    font-size: 4.2rem;
    line-height: 1.75;
    margin-bottom: 25px;
}
.page-ttl-col2-cont .txt-wrap p {
    margin-top: 1em;
}

/* contents-link
-------------------------------------------------- */
.contents-link {
    margin-top: 40px;
}
.service-lead .contents-link {
    margin-top: 0;
}
.page-ttl-col2-cont .contents-link {
    margin-top: 70px;
}
.contents-link-ttl {
	font-size: 1.4rem;
    font-weight: 600;
    letter-spacing: 0.02em;
    padding: 12px 0 0;
    margin-bottom: 20px;
    position: relative;
}
.contents-link-ttl::before {
	content: "";
	width: 186px;
	height: 1px;
	background: #999999;
	position: absolute;
	left: 0;
	top: 0;
}
.contents-link ul {
    display: flex;
    justify-content: flex-start;
    flex-wrap: wrap;
}
.contents-link ul li {
	margin: 15px 26px 0 0;
}
.contents-link ul li:last-child {
    margin-right: 0;
}
.contents-link ul li a {
	display: block;
	position: relative;
    font-size: 1.6rem;
	line-height: 1.6;
    text-decoration: underline;
    background: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="14" height="10" viewBox="0 0 14 10"><path fill-rule="evenodd" fill="rgb(26, 26, 26)" d="M6.998,9.999 L0.001,0.936 L1.274,0.014 L6.998,7.427 L12.722,0.014 L13.995,0.935 L6.998,9.999 Z"/></svg>') no-repeat center left;
    background-size: 14px auto;
    padding-left: 22px;
}

/* page-fig
-------------------------------------------------- */
.page-ttl._fig {
    position: relative;
    box-sizing: border-box;
    color: #ffffff;
    padding-bottom: 55px;
    margin-bottom: 100px;
}
.page-ttl._fig a {
    color: #ffffff;
}
.page-fig {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
}
.page-fig::after {
    content: "";
    width: 100%;
    height: 100%;
    background: rgba(42,44,46,0.50);
    position: absolute;
    left: 0;
    top: 0;
}
.page-fig .thumb {
    height: 100%;
}
.page-fig .thumb img {
    margin-top: -50px;
}

._fig .page-ttl-cont .jattl {
    padding: 130px 0 15px;
}
._detail .page-ttl-cont .jattl {
    padding: 10px 0 15px;
}
._fig .page-ttl-cont .ensubttl {
    font-size: 1.4rem;
    font-weight: 600;
    padding-bottom: 80px;
    opacity: 0;
    transition: 1s 0.2s;
}
.motion ._fig .page-ttl-cont .ensubttl {
    opacity: 1;
}
._detail .page-ttl-cont .ensubttl {
    padding-bottom: 60px;
}

/* page-ttl-btm-fig
-------------------------------------------------- */
.page-ttl-btm-fig {
    margin: 70px 0 0;
}
.page-ttl-btm-fig::after {
    padding-top: 40%;
}

/* page-ttl-nav
-------------------------------------------------- */
.page-ttl-nav {
    width: 480px;
    padding: 20px 25px 0 60px;
    border-left: 1px solid #999999;
    box-sizing: border-box;
}
.page-ttl-nav .page-subnav {
    display: grid;
    grid-template-columns: 1fr auto; 
    column-gap: 40px;
    align-items: start; 
    padding-bottom: 10px;
}
.page-ttl-nav .page-subnav li {
    padding: 0 0 20px;
}
.page-ttl-nav-sp {
    display: none;
}

/* page-subnav
-------------------------------------------------- */
.page-subnav {
    box-sizing: border-box;
}
._fig .page-subnav {
    width: 340px;
    padding: 10px 0 10px 60px;
    border-left: 1px solid #ffffff;
}
._fig .page-subnav li {
    padding: 25px 0 0;
}
.page-subnav li a {
    display: block;
    position: relative;
    padding-left: 56px;
}
.page-subnav li a::before {
    content: "";
}
.page-subnav li a::before,
.page-subnav li a::after {
    content: "";
    width: 37px;
    height: 37px;
    border-radius: 50%;
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    transition: .2s;
    box-sizing: border-box;
}
.page-subnav li a::before {
    border: 1px solid #999999;
}
._fig .page-subnav li a::before {
    border: 1px solid #ffffff;
}
.page-subnav li a::after {
    background: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="13" height="11" viewBox="0 0 13 11"><path fill-rule="evenodd" fill="rgb(153, 153, 153)" d="M7.730,-0.001 L6.995,0.704 L11.108,4.997 L0.000,4.997 L0.000,5.996 L11.114,5.996 L6.995,10.295 L7.730,11.001 L13.000,5.500 L7.730,-0.001 Z"/></svg>') no-repeat center center;
    background-size: 13px auto;
}
._fig .page-subnav li a::after,
.page-subnav li.ac a::after {
    background: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="13" height="11" viewBox="0 0 13 11"><path fill-rule="evenodd" fill="rgb(255, 255, 255)" d="M7.730,-0.001 L6.995,0.704 L11.108,4.997 L0.000,4.997 L0.000,5.996 L11.114,5.996 L6.995,10.295 L7.730,11.001 L13.000,5.500 L7.730,-0.001 Z"/></svg>') no-repeat center center;
    background-size: 13px auto;
}
.page-subnav li.ac a::before {
    border: 1px solid #4aa2df;
    background: #4aa2df;
}

/* hover */
@media screen and (min-width: 768px) {
	.page-subnav li a:hover {
		opacity: 1;
	}
    .page-subnav li a:hover::before {
		border: 1px solid #4aa2df;
		background: #4aa2df;
        transform: translateY(-50%) scale(1.25);
	}
    .page-subnav li a:hover::after {
        background: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="13" height="11" viewBox="0 0 13 11"><path fill-rule="evenodd" fill="rgb(255, 255, 255)" d="M7.730,-0.001 L6.995,0.704 L11.108,4.997 L0.000,4.997 L0.000,5.996 L11.114,5.996 L6.995,10.295 L7.730,11.001 L13.000,5.500 L7.730,-0.001 Z"/></svg>') no-repeat center center;
        background-size: 13px auto;
    }
}

/* breadcrumb
-------------------------------------------------- */
.breadcrumb {
	display: flex;
	justify-content: flex-start;
	flex-wrap: wrap;
    margin-top: 25px;
}
.breadcrumb li {
	position: relative;
	padding-right: 38px;
	margin-right: 15px;
	font-size: 1.5rem;
}
.breadcrumb li::after {
	content: "";
    width: 25px;
    height: 1px;
    background: #1a1a1a;
	position: absolute;
	right: 0;
	top: 50%;
}
._fig .breadcrumb li::after {
    background: #ffffff;
}
.breadcrumb li:last-child::after {
	display: none;
}

/* page-lead
-------------------------------------------------- */
.page-lead {
	position: relative;
	padding-left: 9.5168%;
}

/* sec-ttl
-------------------------------------------------- */
.sec-ttl .ttl {
    display: inline-block;
    font-size: 1.8rem;
    background: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="14" height="14" viewBox="0 0 14 14"><path fill-rule="evenodd" fill="rgb(74, 162, 223)" d="M13.779,0.012 C6.175,0.539 0.255,6.460 0.005,13.784 L-0.001,13.998 L14.010,13.998 L14.010,-0.004 L13.779,0.012 Z"/></svg>') no-repeat center left;
    background-size: 14px 14px;
    padding: 0 0 0 15px;
}
.sec-ttl .enttl {
    font-size: 6.8rem;
    font-weight: 600;
    line-height: 1.3;
}
.ctaArea .sec-ttl .enttl,
.pagelink .sec-ttl .enttl {
    font-size: 6.2rem;
}
.sec-ttl .lead {
    font-size: 2.0rem;
    margin-top: 15px;
}
.sec-ttl-wrap {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    padding-bottom: 60px;
}
.sec-ttl-wrap .sec-ttl {
    padding-right: 8.2918%;
}
.sec-ttl-wrap .lead {
    padding-bottom: 12px;
}

/* cont-ttl
-------------------------------------------------- */
.cont-ttl {
    position: relative;
    padding: 12px 0 0;
}
.cont-ttl::before {
    content: "";
    width: 100%;
    height: 1px;
    background: #999999;
    position: absolute;
    left: 0;
    top: 0;
}
.cont-ttl._short::before {
    width: 59.5744%;
}
.cont-ttl .enttl {
    font-size: 1.4rem;
    font-weight: 600;
    letter-spacing: 0.02em;
    margin-bottom: 25px;
}
.cont-ttl .ttl {
    font-size: 3.4rem;
    margin: 0 -0.85em 0 -0.65em;
}
.cont-ttl .lead {
    font-size: 2.4rem;
    margin: 25px -0.85em 0 -0.65em;
}
.cont-ttl .txt {
    margin: 30px 0 0;
}
.cont-ttl-col2 {
    display: flex;
    justify-content: space-between;
}
.cont-ttl-col2 .ttl {
    white-space: nowrap;
}
.cont-ttl-col2 .txt {
    width: 64.6766%;
    margin: 10px 0 0;
}

/* article-ttl
-------------------------------------------------- */
.article-ttl {
    font-size: 3.2rem;
    margin-bottom: 0.5em;
}

/* txt-slider 
-------------------------------------------------- */
.txt-slider li {
    font-size: 11.4rem;
    line-height: 1.15;
    letter-spacing: -0.03em;
    color: #f1f2ed;
}
._bg .txt-slider li {
    color: #ffffff;
}

/* ===============================================
    btn
=============================================== */

/* btn
-------------------------------------------------- */
.btn a,
.btn .inner {
	width: 260px;
	display: inline-block;
	position: relative;
	line-height: 56px;
	box-sizing: border-box;
	border: 1px solid #1a1a1a;
	text-align: left;
	padding: 0 30px 1px;
    border-radius: calc(infinity * 1px);
	background: #FFFFFF;
	transition: .2s;
    overflow: hidden;
    cursor: pointer;
}
.btn a::before,
.btn a::after {
    content: "";
    width: 37px;
    height: 37px;
    border-radius: 50%;
    position: absolute;
    right: 10px;
    top: 10px;
    background: #4aa2df;
    transition: .2s;
}
.btn a::after {
    background: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="13" height="11" viewBox="0 0 13 11"><path fill-rule="evenodd" fill="rgb(255, 255, 255)" d="M7.730,-0.001 L6.995,0.704 L11.108,4.997 L0.000,4.997 L0.000,5.996 L11.114,5.996 L6.995,10.295 L7.730,11.001 L13.000,5.500 L7.730,-0.001 Z"/></svg>') no-repeat center center;
    background-size: 13px auto;
}
.btn a span {
    display: block;
    position: relative;
}
.btn ._arrow {
    width: 37px;
    height: 37px;
    border-radius: 50%;
    position: absolute;
    right: 10px;
    top: 10px;
    background: #4aa2df;
    transition: .2s;
}
.btn ._arrow::before,
.btn ._arrow::after {
    content: "";
    width: 13px;
    height: 1px;
    background: #ffffff;
    position: absolute;
    left: 12px;
    top: 18px;
    transition: .2s;
}
.btn ._arrow::after {
    transform: rotate(90deg);
}
.btn.op ._arrow::after {
    transform: rotate(0);
}

/* hover */
@media screen and (min-width: 768px) {
	.btn a:hover {
		opacity: 1;
		color: #FFFFFF;
        border: 1px solid #4aa2df;
	}
    .btn a:hover::before {
		transform: scale(13);
	}
    .btn a:hover::after {
		right: 3px;
	}
	
}

/* btn-txt
-------------------------------------------------- */
.btn-txt a {
	display: inline-block;
	font-size: 1.6rem;
	padding-left: 80px;
	position: relative;
	transition: .2s;
	line-height: 35px;
}
.btn-txt._wht a {
    color: #ffffff;
}
.btn-txt a::after {
	content: "";
	width: 59px;
	height: 59px;
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	transition: .2s;
	border: 1px solid #999999;
	border-radius: 50%;
	background: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="13" height="11" viewBox="0 0 13 11"><path fill-rule="evenodd" fill="rgb(26, 26, 26)" d="M7.730,-0.001 L6.995,0.704 L11.108,4.997 L0.000,4.997 L0.000,5.996 L11.114,5.996 L6.995,10.295 L7.730,11.001 L13.000,5.500 L7.730,-0.001 Z"/></svg>') no-repeat center center;
    background-size: 13px auto;
	box-sizing: border-box;
}
.btn-txt._wht a::after {
    border: 1px solid #ffffff;
    background: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="13" height="11" viewBox="0 0 13 11"><path fill-rule="evenodd" fill="rgb(255, 255, 255)" d="M7.730,-0.001 L6.995,0.704 L11.108,4.997 L0.000,4.997 L0.000,5.996 L11.114,5.996 L6.995,10.295 L7.730,11.001 L13.000,5.500 L7.730,-0.001 Z"/></svg>') no-repeat center center;
    background-size: 13px auto;
}
.btn-txt a span {
    display: inline-block;
    position: relative;
    padding-bottom: 4px;
}
.btn-txt a span::after {
    content: "";
    width: 100%;
    height: 1px;
    background: #666666;
    position: absolute;
    left: 0;
    bottom: 0;
}
.btn-txt._wht a span::after {
    background: #ffffff;
}

/* hover */
@media screen and (min-width: 768px) {
    .btn-txt a:hover {
        opacity: 1;
    }
	.btn-txt a:hover::after {
        width: 89px;
        height: 89px;
        left: -15px;
        border: 1px solid #4aa2df;
        background: #4aa2df url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="13" height="11" viewBox="0 0 13 11"><path fill-rule="evenodd" fill="rgb(255, 255, 255)" d="M7.730,-0.001 L6.995,0.704 L11.108,4.997 L0.000,4.997 L0.000,5.996 L11.114,5.996 L6.995,10.295 L7.730,11.001 L13.000,5.500 L7.730,-0.001 Z"/></svg>') no-repeat center center;
        background-size: 13px auto;
	}
}



/* ===============================================
    content-col2
=============================================== */
.content-col2 {
    margin-top: 30px;
}
.content-col2-inner {
    padding-right: 22.0563%;
}

/* ===============================================
    anchor-link
=============================================== */
.anchor-link {
    width: 0;
    position: sticky;
    top: 140px;
    left: 81.9914vw;
    z-index: 9999;
    float: left;
}
.anchor-link-inner {
    width: 13.6163vw;
    padding-bottom: 90px;
}
.anchor-link-ttl {
	font-size: 1.4rem;
    font-weight: 600;
    letter-spacing: 0.02em;
    margin-bottom: 30px;
    padding: 12px 0;
    border-top: 1px solid #999999;
}
.anchor-link li {
	margin: 16px 0;
}
.anchor-link li a {
	display: block;
	position: relative;
    font-size: 1.6rem;
	line-height: 1.6;
    padding-left: 37px;
}
.anchor-link li a::before {
	content: "";
	width: 25px;
	height: 25px;
    background: #ffffff url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="9" height="11" viewBox="0 0 9 11"><path fill-rule="evenodd" fill="rgb(153, 153, 153)" d="M9.001,6.730 L8.296,5.994 L5.003,9.108 L5.003,0.000 L4.004,0.000 L4.004,9.115 L0.705,5.994 L-0.001,6.730 L4.500,11.001 L9.001,6.730 Z"/></svg>') no-repeat center center;
    background-size: 9px auto;
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	border-radius: 50%;
	transition: .2s;
    border: 1px solid #999999;
    box-sizing: border-box;
}
.anchor-link li a.current::before {
	background: #4aa2df url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="9" height="11" viewBox="0 0 9 11"><path fill-rule="evenodd" fill="rgb(255, 255, 255)" d="M9.001,6.730 L8.296,5.994 L5.003,9.108 L5.003,0.000 L4.004,0.000 L4.004,9.115 L0.705,5.994 L-0.001,6.730 L4.500,11.001 L9.001,6.730 Z"/></svg>') no-repeat center center;
    background-size: 9px auto;
    border: 1px solid #4aa2df;
}

/* ===============================================
    parallax
=============================================== */
.parallax01,
.parallax02,
.parallax03 {
    position: relative;
}
.parallax-inner {
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
}
.parallax-img {
	transition: none !important;
	position: relative;
}
.parallax-img span {
	width: 100%;
	height: 100%;
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	transition: none !important;
}
.parallax-img.thumb img {
	width: 110%;
	height: 110%;
}

/* ===============================================
    pagelink
=============================================== */
.pagelink {
    margin: 120px 0 110px;
}
.pagelink-block {
    display: flex;
    justify-content: flex-end;
}
.pagelink-block a {
    display: block;
    width: 66.8325%;
    padding: 10px 0 35px;
    position: relative;
    background: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="100" height="11" viewBox="0 0 100 11"><path fill-rule="evenodd" fill="rgb(26, 26, 26)" d="M94.730,0.000 L93.995,0.705 L98.108,4.997 L0.000,4.997 L0.000,5.997 L98.114,5.997 L93.995,10.296 L94.730,11.001 L100.000,5.500 L94.730,0.000 Z"/></svg>') no-repeat bottom left;
    background-size: 100px auto;
}
.pagelink-block a::before,
.pagelink-block a::after {
    content: "";
    width: 100%;
    height: 1px;
    background: #d9d9d9;
    position: absolute;
    left: 0;
    top: 0;
    transform-origin: left center;
    transition: 1s ease;
    transform: scaleX(0);
}
.pagelink-block a::after {
    background: #808080;
    transition: .3s ease;
}
.on.pagelink-block a::before {
    transform: scaleX(1);
}
.pagelink-block .entxt {
    font-size: 1.4rem;
    font-weight: 600;
    transition: 0.6s;
    opacity: 0;
    padding-bottom: 50px;
}
.on.pagelink-block .entxt {
    opacity: 1;
}

/* hover */
@media screen and (min-width: 768px) {
	.pagelink-block a:hover::after {
        transform: scaleX(1);
	}
}

/* ===============================================
    table
=============================================== */
dl.table {
	width: 100%;
	display: flex;
    justify-content: space-between;
    align-items: stretch;
	flex-wrap: wrap;
}
dl.table dt {
	width: 22%;
	border-bottom: 1px solid #cccccc;
	padding: 16px 0;
	box-sizing: border-box;
}
dl.table dd {
	width: 78%;
	border-bottom: 1px solid #cccccc;
	padding: 16px 0 6px;
	box-sizing: border-box;
}
dl.table dd p {
	padding-bottom: 10px;
}

/* ===============================================
    list-disc 
=============================================== */
.list-disc-ttl {
	margin-bottom: 5px;
}
.list-disc {
	list-style-type: disc;
	list-style-position: inside;
}
.list-disc > li {
	text-indent: -1em;
	line-height: 1.7;
	padding: 2px 0 2px 1em;
    box-sizing: border-box;
}
.list-note li {
	text-indent: -1.5em;
	line-height: 1.7;
	padding: 2px 0 2px 1.5em;
}
.list-note li::before {
	content: "※ ";
}

/*/////////////////////////////////////////////////////////////////////////////


              // Slider //
	  

/////////////////////////////////////////////////////////////////////////////*/
.slick-slider {
    position: relative;
    display: block;
    box-sizing: border-box;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-touch-callout: none;
    -khtml-user-select: none;
    -ms-touch-action: pan-y;
    touch-action: pan-y;
    -webkit-tap-highlight-color: transparent;
}
.slick-list {
    position: relative;
    display: block;
    overflow: hidden;
    margin: 0;
    padding: 0;
}
.slick-list:focus {
    outline: none;
}
.slick-list.dragging {
    cursor: pointer;
    cursor: hand;
}
.slick-slider .slick-track,
.slick-slider .slick-list {
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -o-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
}
.slick-track {
    position: relative;
    top: 0;
    left: 0;
    display: block;
}
.slick-track:before,
.slick-track:after {
    display: table;
    content: '';
}
.slick-track:after {
    clear: both;
}
.slick-loading .slick-track {
    visibility: hidden;
}
.slick-slide {
    display: none;
    float: left;
    height: 100%;
    min-height: 1px;
}
[dir='rtl'] .slick-slide {
    float: right;
}
.slick-slide img {
    display: block;
}
.slick-slide.slick-loading img {
    display: none;
}
.slick-slide.dragging img {
    pointer-events: none;
}
.slick-initialized .slick-slide {
    display: block;
}
.slick-loading .slick-slide {
    visibility: hidden;
}
.slick-vertical .slick-slide {
    display: block;
    height: auto;
    border: 1px solid transparent;
}
.slick-arrow.slick-hidden {
    display: none;
}
/* Arrows */
.slick-prev,
.slick-next {   
    position:  absolute;
	bottom: 0;
	width: 59px;
	height: 59px;
	overflow: hidden;
	font-size: 0;
    line-height: 0;
	display: block;
	cursor: pointer;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: 13px auto;
	background-color: rgba(255, 255, 255, 1.00);
	z-index: 999;
	transition: .2s;
	border-radius: 50%;
    border: 1px solid #999999;
    box-sizing: border-box;
}
.slick-prev {
	background-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="13" height="11" viewBox="0 0 13 11"><path fill-rule="evenodd" fill="rgb(26, 26, 26)" d="M5.270,10.1000 L6.005,10.295 L1.892,6.002 L13.000,6.002 L13.000,5.003 L1.886,5.003 L6.005,0.705 L5.270,-0.001 L0.000,5.500 L5.270,10.1000 Z"/></svg>');
	left: 0px;
}
.slick-next {
	background-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="13" height="11" viewBox="0 0 13 11"><path fill-rule="evenodd" fill="rgb(26, 26, 26)" d="M7.730,-0.001 L6.995,0.704 L11.108,4.997 L0.000,4.997 L0.000,5.996 L11.114,5.996 L6.995,10.295 L7.730,11.001 L13.000,5.500 L7.730,-0.001 Z"/></svg>');
	left: 75px;
}
.slick-prev:active,
.slick-prev:focus,
.slick-next:active,
.slick-next:focus,
.slick-slide a {
    outline: none;
}
.slick-next.slick-disabled {
	opacity: 0 !important;
}
.group-slider .slick-prev,
.group-slider .slick-next {
    bottom: -10px;
}
.group-slider .slick-prev {
    left: 44.5vw;
}
.group-slider .slick-next {
    left: 49.1215vw;
}
.interview-slider .slick-prev,
.interview-slider .slick-next {
    bottom: inherit;
    top: 50%;
    margin-top: -30px;
}
.interview-slider .slick-prev {
    left: -30px;
}
.interview-slider .slick-next {
    left: inherit;
    right: 3.6603vw;
}

/* Dots */
.slick-dotted.slick-slider {
    margin-bottom: 50px;
}
.slick-dots {
    position: absolute;
    bottom: -50px;
    display: block;
    width: 100%;
    padding: 0;
    margin: 0;
    list-style: none;
    text-align: center;
}
.slick-dots li {
    position: relative;
    display: inline-block;
    width: 6px;
    height: 6px;
    margin: 0 10px !important;
    padding: 0 !important;
    cursor: pointer;
}
.slick-dots li button {
    font-size: 0;
    line-height: 0;
    display: block;
    width: 6px;
    height: 6px;
	padding: 0;
    cursor: pointer;
    color: transparent;
    border: 0;
    outline: none;
    background: #535c66;
	opacity: 0.2;
	border-radius: 3px;
}
.slick-dots li.slick-active button {
    opacity: .75;
}

/* hover */
@media screen and (min-width: 768px) {
	.slick-prev:hover,
	.slick-next:hover {
		opacity: 0.5;
	}
}

/*/////////////////////////////////////////////////////////////////////////////


              // colorbox //
	  

/////////////////////////////////////////////////////////////////////////////*/
#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:99999; }
#cboxOverlay{position:fixed; width:100%; height:100%;}
#cboxMiddleLeft, #cboxBottomLeft{clear:left;}
#cboxContent{position:relative;}
#cboxLoadedContent{overflow:auto;}
#cboxTitle{margin:10px auto; color: #ffffff; font-size: 1.4rem;}
#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%; height:100%;}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}
.cboxPhoto{float:left; margin:auto; border:0; display:block; padding:0;}
.cboxIframe{width:100%; height:100%; display:block; border:0;}
#cboxOverlay{background: rgba(0,0,0,0.90);}
#colorbox{font: 12px Tahoma, Arial,sans-serif;}
#cboxContent{margin:60px 0 0;}
.cboxIframe{background:#fff;}
#cboxError{padding:50px; border:1px solid #ccc;}
#cboxLoadedContent{border:none; background:#fff;}
#cboxTitle{display:none;}
#cboxCurrent{display:none !important;}
#cboxSlideshow{position:absolute; bottom:-20px; left:0px; color:#fff;}
#cboxLoadingOverlay{background:#000;}
#cboxPrevious,
#cboxNext {
    position:  absolute;
	top: 50%;
    margin-top: -22px;
	width: 45px;
	height: 45px;
	overflow: hidden;
	font-size: 0;
    line-height: 0;
	display: block;
	cursor: pointer;
    border: none;
    background-color: #1a1a1a;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: 8px auto;
	z-index: 999;
	transition: .3s;
	border-radius: 50%;
    box-sizing: border-box;
    text-indent:-9999px;
}
#cboxPrevious {
	background-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="8" height="7" viewBox="0 0 8 7"><path fill="rgb(255, 255, 255)" d="M6,7L0,3.5,6,0v7Z"/></svg>');
    left: -55px;
}
#cboxNext {
	background-image: url('data:image/svg+xml;charset=UTF-8,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="8" height="7" viewBox="0 0 8 7"><path fill="rgb(255, 255, 255)" d="M2,0l6,3.5-6,3.5V0Z"/></svg>');
    right: -55px;
}
@media screen and (max-width: 767px) {
    #cboxPrevious,
    #cboxNext {
        margin-top: -13px;
        width: 25px;
        height: 25px;
        background-color: rgba(0,0,0,0.40);
    }
	#cboxPrevious {
	    left: 5px;
	}
	#cboxNext {
	    right: 5px;
	}
}
#cboxClose {
	border:none;
	text-indent:-9999px;
	display: inline-block;
	position: absolute;
	width: 45px;
	height: 45px;
	cursor: pointer;
	right: 0px;
	top: -55px;
	background: #1a1a1a;
	border-radius: 50%;
}
#cboxClose::before,
#cboxClose::after {
	content: "";
	width: 19px;
	height: 1px;
	background: #FFFFFF;
	position: absolute;
	top: 22px;
	left: 13px;
	transform-origin: center center;
}
#cboxClose::before {
	transform: rotate(-45deg);
}
#cboxClose::after {
	transform: rotate(45deg);
}
@media screen and (max-width: 767px) {
    #cboxClose {
        width: 35px;
        height: 35px;
        top: -45px;
    }
    #cboxClose::before,
    #cboxClose::after {
        width: 15px;
        top: 17px;
        left: 10px;
    }
}

/*/////////////////////////////////////////////////////////////////////////////


              // motion //
	  

/////////////////////////////////////////////////////////////////////////////*/


/* ef txtef
-------------------------------------------------- */
.txtef-wrap {
	display: block;
	overflow: hidden;
}
.txtef {
	display: block;
	transform: translateY(105%);
}
.eft.on .txtef-wrap:nth-child(1) .txtef {
    transition: 1s cubic-bezier(0.76, 0.09, 0.215, 1);
    transform: translateY(0);
}
.eft.on .txtef-wrap:nth-child(2) .txtef {
    transition: 1s cubic-bezier(0.76, 0.09, 0.215, 1) .1s;
    transform: translateY(0);
}
.eft.on .txtef-wrap:nth-child(3) .txtef {
    transition: 1s cubic-bezier(0.76, 0.09, 0.215, 1) .2s;
    transform: translateY(0);
}
.eft.on .txtef-wrap:nth-child(4) .txtef {
    transition: 1s cubic-bezier(0.76, 0.09, 0.215, 1) .3s;
    transform: translateY(0);
}

/* ttl-overlay
-------------------------------------------------- */
@keyframes ttl-overlay {
	0% {
		transform: scaleX(1);
	}
	100% {
		transform: scaleX(0);
	}
}

/* ttl-fadeup
-------------------------------------------------- */
@keyframes ttl-fadeup {
	0% {
		transform: translateY(100%);
	}
	100% {
		transform: translateY(0);
	}
}

/* fade
-------------------------------------------------- */
.mf {
	opacity: 0;
}
.mf.on {
    transition: opacity 1s !important;
    opacity: 1;
}
@keyframes fade {
	0% {
		opacity: 0; }
	100% {
		opacity: 1; }
}

/* fade up
-------------------------------------------------- */
.mfu {
	opacity: 0;
	transform: translateY(60px);
}
span.mfu {
	display: block;
}
.mfu.on {
    transition: 2s cubic-bezier(0.075, 0.82, 0.165, 1);
    opacity: 1;
    transform: translateY(0);
}

/* fade up list
-------------------------------------------------- */
.mful li {
	opacity: 0;
	transform: translateY(40px);
}
.mful.on li:nth-child(1) {
	transition: 2s cubic-bezier(0.075, 0.82, 0.165, 1);
    opacity: 1;
    transform: translateY(0);
}
.mful.on li:nth-child(2) {
	transition: 2s cubic-bezier(0.075, 0.82, 0.165, 1) .2s;
    opacity: 1;
    transform: translateY(0);
}
.mful.on li:nth-child(3) {
	transition: 2s cubic-bezier(0.075, 0.82, 0.165, 1) .4s;
    opacity: 1;
    transform: translateY(0);
}
.mful.on li:nth-child(4) {
	transition: 2s cubic-bezier(0.075, 0.82, 0.165, 1) .6s;
    opacity: 1;
    transform: translateY(0);
}
.mful.on li:nth-child(5) {
	transition: 2s cubic-bezier(0.075, 0.82, 0.165, 1) .8s;
    opacity: 1;
    transform: translateY(0);
}
.mful.on li:nth-child(6) {
	transition: 2s cubic-bezier(0.075, 0.82, 0.165, 1) 1.0s;
    opacity: 1;
    transform: translateY(0);
}
.mful.on li:nth-child(7) {
	transition: 2s cubic-bezier(0.075, 0.82, 0.165, 1) 1.2s;
    opacity: 1;
    transform: translateY(0);
}
.mful.on li:nth-child(8) {
	transition: 2s cubic-bezier(0.075, 0.82, 0.165, 1) 1.4s;
    opacity: 1;
    transform: translateY(0);
}

/* fade down
-------------------------------------------------- */
.mfd {
	opacity:0;
	-webkit-transform:translateY(-80px);
	transform:translateY(-80px);
}
span.mfd {
	display: block;
}
.mfd.on {
	-webkit-animation: ef-fadedown 2s cubic-bezier(0.075, 0.82, 0.165, 1) forwards;
	animation: ef-fadedown 2s cubic-bezier(0.075, 0.82, 0.165, 1) forwards;
}
@-webkit-keyframes ef-fadedown {
	0% {
		opacity:0;
		transform:translateY(-80px); }
	100% {
		opacity:1;
		transform:translateY(0%); }
}
@keyframes ef-fadedown {
	0% {
		opacity:0;
		transform:translateY(-80px); }
	100% {
		opacity:1;
		transform:translateY(0%); }
}

/* fade left
-------------------------------------------------- */
.mfl {
	opacity: 0;
	transform: translateX(-40px);
}
.mfl.on {
	animation: ef-fadeleft 2s cubic-bezier(0.075, 0.82, 0.165, 1) forwards;
}
@keyframes ef-fadeleft {
	0% {
		opacity: 0;
		transform: translateX(-40px); }
	100% {
		opacity: 1;
		transform: translateY(0%); }
}

/* fade right
-------------------------------------------------- */
.mfr {
	opacity: 0;
	transform: translateX(40px);
}
.mfr.on {
	animation: ef-faderight 2s cubic-bezier(0.075, 0.82, 0.165, 1) forwards;
}
@keyframes ef-faderight {
	0% {
		opacity: 0;
		transform: translateX(40px); }
	100% {
		opacity: 1;
		transform: translateY(0%); }
}

/* ef txtef mask
-------------------------------------------------- */
.mtm {
	display: inline-block;
	position: relative;
}
.mtm::after {
	content: "";
	width: 100%;
	height: 100%;
	background: rgba(255,255,255,0.80);
	position: absolute;
	left: 0;
	top: 0;
	transform-origin: right center;
}
.mtm._gry::after {
	background: rgba(248,248,248,0.80);
}
.mtm._blk::after {
	background: rgba(42,44,46,0.80);
}
.mtm.on::after  {
	animation: ef-scaleX 1.4s cubic-bezier(0.04, 0.8, 0.35, 1) forwards;
}

/* ef scaleX
-------------------------------------------------- */
.ef .thumb::before {
	content: "";
	width: calc(100% + 2px);
	height: calc(100% + 2px);
	position: absolute;
	left: 0;
	top: 0;
	background: #FFFFFF;
	z-index: 2;
	transform-origin: right center;
}
.ef._gry .thumb::before {
    background: #f7f7f7;
}
.ef.on .thumb::before {
    transition: 0.70s cubic-bezier(0.76, 0.09, 0.215, 1);
    transform: scaleX(0);
}
@keyframes ef-scaleX {
	0% {
		transform: scaleX(1); }
	100% {
		transform: scaleX(0); }
}