@charset "UTF-8";

@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@300;400;500;700&family=Yantramanav:wght@400;500;700&display=swap');

html{
	font-size:62.5%;
}

img{
	width:100%;
	height:auto;
}

a{
	text-decoration: none;
	color:#000;
}

.clearfix:after {
    content:" ";
    display:block;
    clear:both;
}

.object-fit-img {
  		object-fit: cover;
		width:100%;
		height:100%;
  		font-family: 'object-fit: cover;'
}

.font-yan{
	font-family: 'Yantramanav', sans-serif;
}

sup{
	font-size:0.8em;
	position: relative;
	top:-0.3em;
}

body{
	padding:0;
	margin:0;
	background:#fff;
	position:relative;
	color:#1a1a1a;
	font-feature-settings: "palt";
	letter-spacing: .8px;	
	font-family: 'Noto Sans JP', sans-serif;
}


@media screen and (min-width:769px){
	
	.pc_none{display:none !important;}
	
	body{
		font-size:1.4rem;  /*14px*/;
		line-height:2.6rem;
		min-width: 1100px;
	}
	
	/*header*/
	header{
		position: fixed;
		top:0;
		left:0;
		width:100%;
		display: flex;
		align-items: center;
		justify-content: space-between;
		z-index:10;
		transition: all 0.2s;
	}
	
	header.active{
		background:#fff;
	}
	
	.page header{
		background:#fff;
	}
	
	header .logo{
		margin:0 0 0 40px;
		width:290px;
		width:360px;
		line-height: 0;
	}
	
	header nav{
		display: flex !important;
		justify-content: space-between;
		align-items: center;
		width:60%;
		max-width: 700px;
		width:36%;
		max-width: 500px;
	}
	
	header nav a{
		margin:0 0 0 0;
		font-weight: 500;
		transition: all 0.2s;
		position: relative;
	}
	
	header nav a::after{
		position: absolute;
  		bottom: -2px;
  		left: 0;
  		content: '';
  		width: 100%;
  		height: 1px;
  		background: #1a1a1a;
  		transform: scale(0, 1);
  		transform-origin: right top;
  		transition: transform .3s;
	}
	
	header nav a.contactbtn{
		width:160px;
		height:100px;
		background:#1a1a1a;
		color:#fff;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		font-size:1.1rem;
		transition: all 0.2s;
	}
	
	header.active nav a.contactbtn{
		width:160px;
		height:90px;
		background:#1a1a1a;
		color:#fff;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		font-size:1.1rem;
	}
	
	header nav a.contactbtn .icon{
		width:28px;
		margin:0 0 0 0;
		line-height: 0;
	}
	
	header nav a:hover::after{
		transform-origin: left top;
  		transform: scale(1, 1);
	}
	
	header nav a.contactbtn:hover::after{
		display: none;
	}
	
	
	/*footer*/
	.contact_bottom_area{
		border-top:1px solid #fdd000;
		padding:55px 0;
	}
	
	.contact_bottom_area .innerbox{
		width:1000px;
		margin:0 auto;
		display: flex;
		justify-content: space-between;
		align-items: center;
	}
	
	.contact_bottom_area .innerbox .txcont{
		display: flex;
		flex-direction: column;
	}
	
	.contact_bottom_area .innerbox .txcont::after{
		content: "";
		width:36px;
		border-bottom:2px solid #fdd000;
		display: block;
	}
	
	.contact_bottom_area .innerbox .txcont .sub{
		font-size:1.3rem;
		line-height: 1;
		font-weight: 500;
	}
	
	.contact_bottom_area .innerbox .txcont .txbox{
		display: flex;
		align-items: center;
		padding:5px 0;
	}
	
	.contact_bottom_area .innerbox .txcont .mtx{
		font-size:6.5rem;
		line-height: 1;
		font-weight: 700;
	}
	
	.contact_bottom_area .innerbox .txcont .tx{
		font-size:1.3rem;
		line-height: 2.3rem;
		margin:0 0 0 20px;
	}
	
	footer{
		padding:90px 0 0 0;
		background:#fdd000;
	}
	
	footer .innerbox{
		padding:0 0 30px 0;
	}
	
	footer .innerbox .logo{
		width:290px;
		margin:0 auto;
		line-height: 0;
		padding:0 0 60px 0;
	}
	
	footer .innerbox .tx{
		text-align: center;
		font-size:1.3rem;
		line-height: 2.3rem;
	}
	
	footer .copy{
		border-top:1px solid #fff;
		border-bottom:4px solid #fff;
		padding:15px 40px;
		display: flex;
		justify-content: space-between;
		align-items: center;
		font-size:1.1rem;
	}
	
	footer .copy .box{
		width:15%;
		font-weight: 500;
	}
	
	footer .copy .box2{
		width:15%;
		font-weight: 500;
		display: flex;
		justify-content: flex-end;
	}
	
	footer .copy .box2 .pagetop{
		width:70px;
		height:70px;
		position: relative;
		cursor: pointer;
	}
	
	footer .copy .box2 .pagetop::after{
		content: "";
		width:100%;
		height:100%;
		background:#fff;
		border-radius: 50%;
		position: absolute;
		top:0;
		left:0;
		z-index:1;
		transition: all 0.2s;
		transition: scale(1);
	}
	
	footer .copy .box2 .pagetop:hover::after{
		transform: scale(1.1);
	}
	
	footer .copy .box2 .pagetop::before{
		content:"";
		width:11px;
		height:11px;
		background:url("../images/common/b_arrow.svg") no-repeat;
		background-size:11px;
		display: block;
		transform: rotate(-90deg);
		position: absolute;
		right:calc(50% - 5px);
		top:calc(50% - 5px);
		z-index:2;
	}
	
	/*maincontainer*/
	#maincontainer{
		border-top:100px solid #fff;
	}
	
	/*arrow*/
	.right_arrow_btn{
		display: flex;
		align-items: center;
		font-weight: 500;
	}
	
	.right_arrow_btn span{
		width:60px;
		height:60px;
		display: flex;
		background:#1a1a1a;
		border-radius: 50%;
		justify-content: center;
		align-items: center;
		margin:0 0 0 20px;
		position: relative;
	}
	
	.right_arrow_btn span::before{
		content:"";
		width:10px;
		height:10px;
		background:url("../images/common/w_arrow.svg") no-repeat;
		background-size:10px;
		display: block;
		position: absolute;
		right:calc(50% - 5px);
		top:calc(50% - 5px);
		
	}
	
	.right_arrow_btn span::after{
		content:"";
		width:10px;
		height:10px;
		background:url("../images/common/w_arrow.svg") no-repeat;
		background-size:10px;
		opacity: 0;
		position: absolute;
		right:40px;
		top:calc(50% - 5px);
		
	}
	
	.right_arrow_btn:hover span::before {
  		animation: arrowbefore .25s;
		animation-fill-mode: forwards;
	}
	
	.right_arrow_btn:hover span::after {
  		animation: arrowafter .25s;
		animation-delay: .25s;
		animation-fill-mode: forwards;
	}
	
	.left_arrow_btn{
		display: flex;
		align-items: center;
		font-weight: 500;
	}
	
	.left_arrow_btn span{
		width:60px;
		height:60px;
		display: flex;
		background:#1a1a1a;
		border-radius: 50%;
		justify-content: center;
		align-items: center;
		margin:0 0 0 20px;
		position: relative;
	}
	
	.left_arrow_btn span::before{
		content:"";
		width:10px;
		height:10px;
		background:url("../images/common/w_arrow.svg") no-repeat;
		background-size:10px;
		display: block;
		position: absolute;
		transform: rotate(180deg);
		left:calc(50% - 5px);
		top:calc(50% - 5px);
		
	}
	
	.left_arrow_btn span::after{
		content:"";
		width:10px;
		height:10px;
		background:url("../images/common/w_arrow.svg") no-repeat;
		background-size:10px;
		opacity: 0;
		position: absolute;
		transform: rotate(180deg);
		left:40px;
		top:calc(50% - 5px);
		
	}
	
	.left_arrow_btn:hover span::before {
  		animation: arrowbefore3 .25s;
		animation-fill-mode: forwards;
	}
	
	.left_arrow_btn:hover span::after {
  		animation: arrowafter3 .25s;
		animation-fill-mode: forwards;
		animation-delay: .25s;
	}
	
	.border_arrow_btn{
		display: flex;
		align-items: center;
		font-weight: 500;
		position: relative;
		padding:0 0 10px 10px;
		line-height: 1;
	}
	
	.border_arrow_btn::before{
		content: "";
		width:100%;
		border-bottom:2px solid #1a1a1a;
		position: absolute;
		bottom:0;
		left:0;
		transform: scaleX(1);
		transform-origin: right;
	}
	
	.border_arrow_btn::after{
		content: "";
		width:100%;
		border-bottom:2px solid #1a1a1a;
		position: absolute;
		bottom:0;
		left:0;
		transform: scaleX(0);
		transform-origin: left;
	}
	
	.border_arrow_btn span{
		width:30px;
		height:10px;
		display: flex;
		background:none;
		justify-content: center;
		align-items: center;
		margin:2px 0 0 0;
		position: relative;
	}
	
	.border_arrow_btn span::before{
		content:"";
		width:10px;
		height:10px;
		background:url("../images/common/b_arrow.svg") no-repeat;
		background-size:10px;
		display: block;
		position: absolute;
		right:calc(50% - 5px);
		top:calc(50% - 5px);
		
	}
	
	.border_arrow_btn span::after{
		content:"";
		width:10px;
		height:10px;
		background:url("../images/common/b_arrow.svg") no-repeat;
		background-size:10px;
		opacity: 0;
		position: absolute;
		right:20px;
		top:calc(50% - 5px);
		
	}
	
	.border_arrow_btn:hover span::before {
  		animation: arrowbefore2 .25s;
		animation-fill-mode: forwards;
	}
	
	.border_arrow_btn:hover span::after {
  		animation: arrowafter2 .25s;
		animation-fill-mode: forwards;
		animation-delay: .25s;
	}
	
	.border_arrow_btn:hover::before{
		animation: width1 .25s;
		animation-timing-function: ease-out;
		animation-fill-mode: forwards;
	}
	
	.border_arrow_btn:hover::after{
		animation: width2 .25s;
		animation-delay: 0.25s;
		animation-timing-function: ease-out;
		animation-fill-mode: forwards;
	}
	
	.prev_arrow_btn{
		display: flex;
		align-items: center;
		font-weight: 500;
		position: relative;
		padding:0 0 0 0;
		line-height: 1;
	}
	
	.prev_arrow_btn span{
		width:30px;
		height:10px;
		order:-1;
		display: flex;
		background:none;
		justify-content: center;
		align-items: center;
		margin:2px 0 0 0;
		position: relative;
	}
	
	.prev_arrow_btn span::before{
		content:"";
		width:10px;
		height:10px;
		background:url("../images/common/b_arrow.svg") no-repeat;
		background-size:10px;
		transform: rotate(180deg);
		display: block;
		position: absolute;
		left:calc(50% - 5px);
		top:calc(50% - 5px);
		
	}
	
	.prev_arrow_btn span::after{
		content:"";
		width:10px;
		height:10px;
		background:url("../images/common/b_arrow.svg") no-repeat;
		background-size:10px;
		transform: rotate(180deg);
		opacity: 0;
		position: absolute;
		left:20px;
		top:calc(50% - 5px);
		
	}
	
	.prev_arrow_btn:hover span::before {
  		animation: arrowbefore3 .25s;
		animation-fill-mode: forwards;
	}
	
	.prev_arrow_btn:hover span::after {
  		animation: arrowafter3 .25s;
		animation-fill-mode: forwards;
		animation-delay: .25s;
	}
	
	.next_arrow_btn{
		display: flex;
		align-items: center;
		font-weight: 500;
		position: relative;
		padding:0 0 0 0;
		line-height: 1;
	}
	
	.next_arrow_btn span{
		width:30px;
		height:10px;
		display: flex;
		background:none;
		justify-content: center;
		align-items: center;
		margin:2px 0 0 0;
		position: relative;
	}
	
	.next_arrow_btn span::before{
		content:"";
		width:10px;
		height:10px;
		background:url("../images/common/b_arrow.svg") no-repeat;
		background-size:10px;
		display: block;
		position: absolute;
		right:calc(50% - 5px);
		top:calc(50% - 5px);
		
	}
	
	.next_arrow_btn span::after{
		content:"";
		width:10px;
		height:10px;
		background:url("../images/common/b_arrow.svg") no-repeat;
		background-size:10px;
		opacity: 0;
		position: absolute;
		right:20px;
		top:calc(50% - 5px);
		
	}
	
	.next_arrow_btn:hover span::before {
  		animation: arrowbefore2 .25s;
		animation-fill-mode: forwards;
	}
	
	.next_arrow_btn:hover span::after {
  		animation: arrowafter2 .25s;
		animation-fill-mode: forwards;
		animation-delay: .25s;
	}
	
	.down_arrow_btn{
		display: flex;
		font-weight: 500;
		position: relative;
		padding:0 0 10px 0;
		line-height: 1;
		justify-content: space-between;
		align-items: flex-end;
	}
	
	.down_arrow_btn::before{
		content: "";
		width:100%;
		border-bottom:1px solid #c2c2c2;
		position: absolute;
		bottom:0;
		left:0;
		transform: scaleX(1);
		transform-origin: right;
	}
	
	.down_arrow_btn::after{
		content: "";
		width:100%;
		border-bottom:1px solid #1a1a1a;
		position: absolute;
		bottom:0;
		left:0;
		transform: scaleX(0);
		transform-origin: left;
	}
	
	.down_arrow_btn span{
		width:10px;
		height:10px;
		display: flex;
		background:none;
		justify-content: center;
		align-items: center;
		margin:2px 0 0 0;
		position: relative;
	}
	
	.down_arrow_btn span::before{
		content:"";
		width:10px;
		height:10px;
		background:url("../images/common/b_arrow.svg") no-repeat;
		background-size:10px;
		display: block;
		transform: rotate(90deg);
		position: absolute;
		right:calc(50% - 5px);
		top:calc(50% - 5px);
		
	}
	
	.down_arrow_btn span::after{
		content:"";
		width:10px;
		height:10px;
		background:url("../images/common/b_arrow.svg") no-repeat;
		background-size:10px;
		transform: rotate(90deg);
		opacity: 0;
		position: absolute;
		right:calc(50% - 5px);
		top:-10px;
		
	}
	
	.down_arrow_btn:hover span::before {
  		animation: arrowbefore4 .25s;
		animation-fill-mode: forwards;
	}
	
	.down_arrow_btn:hover span::after {
  		animation: arrowafter4 .25s;
		animation-fill-mode: forwards;
		animation-delay: .25s;
	}
	
	.down_arrow_btn:hover::after{
		animation: width2 .5s;
		animation-delay: 0s;
		animation-timing-function: ease-out;
		animation-fill-mode: forwards;
	}
	
	.down_arrow_btn .tx {
  		font-size:1.3rem;
		display: flex;
		flex-direction: column;
	}
	
	.down_arrow_btn .tx num {
  		font-size:0.9rem;
		margin:0 0 5px 0;
	}
	
	/*pan*/
	#pan{
		width:100%;
		background:#fdd000;
		padding:15px 0;
		font-size:1.3rem;
		line-height: 1;
	}
	
	#pan .innerbox{
		width:1100px;
		margin:0 auto;
	}
	
	#pan .innerbox a{
		color:#666;
		text-decoration: underline;
	}
	
	/*page_main_tl*/
	.page_main_tl{
		padding:100px 0;
		width:1100px;
		margin:0 auto;
		display: flex;
		justify-content: space-between;
		align-items: flex-end;
	}
	
	.page_main_tl .tlcont{
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		margin:0 0 0 0;
	}
	
	.page_main_tl .tlcont .sub{
		font-size:1.3rem;
		font-weight: 500;
	}
	
	.page_main_tl .tlcont .mtlbox{
		font-size:6.5rem;
		font-weight: 700;
		line-height: 1;
		display: flex;
		flex-direction: column;
		align-items: flex-start;
	}
	
	.page_main_tl .tlcont .mtlbox .mtx{
		padding:0 0 5px 0;
	}
	
	.page_main_tl .tlcont .mtlbox::after{
		content: "";
		width:36px;
		border-bottom:2px solid #fdd000;
		display: block;
	}
	
	.page_main_tl .btnbox{
		display: flex;
		padding:0 0 20px 0;
	}
	
	.page_main_tl .btnbox a{
		margin:0 0 0 20px;
		width:160px;
	}
	
	/*pagenav*/
	.pagenav{
		width:100%;
		text-align: center;
	}
	
	.pagenav .wp-pagenavi{
		padding:50px 0 0 0;
		display: flex;
		justify-content: center;
	}
	
	.pagenav a{
		margin:0 5px;
		border:1px solid #999;
		padding:5px 0;
		border-radius: 5px;
		width:50px;
		height:50px;
		color:#999;
		display: flex;
		justify-content: center;
		align-items: center;
	}
	
	.pagenav a.nextpostslink,
	.pagenav a.previouspostslink{
		text-indent: -9999px;
	}
	
	.pagenav a.nextpostslink::after{
		content: "";
		display: inline-block;
  		width: 8px;
  		height: 8px;
  		margin: 0 0;
  		border-top: 2px solid #999;
  		border-right: 2px solid #999;
  		transform: rotate(45deg);
	}
	
	.pagenav a.previouspostslink::after{
		content: "";
		display: inline-block;
  		width: 8px;
  		height: 8px;
  		margin: 0 0;
  		border-left: 2px solid #999;
  		border-bottom: 2px solid #999;
  		transform: rotate(45deg);
	}
	
	.pagenav a:hover{
		color:#fff;
		background:#1a1a1a;
		border:1px solid #1a1a1a;
	}
	
	.pagenav a.nextpostslink:hover::after{
  		border-top: 2px solid #fff;
  		border-right: 2px solid #fff;
	}
	
	.pagenav a.previouspostslink:hover::after{
  		border-left: 2px solid #fff;
  		border-bottom: 2px solid #fff;
	}
	
	.pagenav span.current{
		margin:0 5px;
		color:#fff;
		background:#1a1a1a;
		border:1px solid #1a1a1a;
		padding:0 0;
		border-radius: 5px;
		width:50px;
		height:50px;
		display: flex;
		justify-content: center;
		align-items: center;
	}
	
	.pagenav span.extend{
		margin:0 5px;
		border:1px solid #999;
		padding:0 0;
		border-radius: 5px;
		width:50px;
		color:#999;
		height:50px;
		display: flex;
		justify-content: center;
		align-items: center;
	}
}

@keyframes arrowbefore {
  100% {
    right:0;
    opacity: 0;
  }
  }
 @keyframes arrowafter {
  100% {
    right:calc(50% - 5px);
    opacity: 1;
  }
}
	 
@keyframes arrowbefore2 {
  100% {
    right:0;
    opacity: 0;
  }
  }
 @keyframes arrowafter2 {
  100% {
    right:calc(50% - 5px);
    opacity: 1;
  }
}

@keyframes arrowbefore3 {
  100% {
    left:0;
    opacity: 0;
  }
  }
 @keyframes arrowafter3 {
  100% {
    left:calc(50% - 5px);
    opacity: 1;
  }
}

@keyframes arrowbefore4 {
  100% {
    top:10px;
    opacity: 0;
  }
  }
 @keyframes arrowafter4 {
  100% {
    top:calc(50% - 5px);
    opacity: 1;
  }
}

@keyframes width1 {
  100% {
    transform:scaleX(0);
  }
  }
 @keyframes width2 {
  100% {
    transform:scaleX(1);
  }
}

@media screen and (max-width:768px){
	
	.sp_none{display:none !important;}
	
	body{
		font-size:1.2rem;  /*12px*/;
		line-height: 2.1rem;
		min-width: 100%;
	}
	
	.menu{
		width:50px;
		height:50px;
		background:#fdd000;
		top:0;
		right:0;
		z-index:10;
		order:2;
		display: flex;
		justify-content: center;
		align-items: center;

	}

	.menu-trigger,
	.menu-trigger span {
  		display: inline-block;
  		transition: all .4s;
  		box-sizing: border-box;
		cursor: pointer;
	}
	.menu-trigger {
  		position: relative;
  		width: 25px;
  		height: 16px;
		z-index:5;
	}
	.menu-trigger span {
  		position: absolute;
  		left: 0;
  		width: 100%;
  		height: 2px;
  		background-color: #1a1a1a;
  		border-radius: 0px;
	}

	.menu-trigger span:nth-of-type(1) {
  		top: 0;
	}
	.menu-trigger span:nth-of-type(2) {
 		top:7px;
	}
	.menu-trigger span:nth-of-type(3) {
  		bottom: 0;
		width:100% !important;
	}

	.menu-trigger.active span:nth-of-type(1) {
  		-webkit-transform: translateY(7px) rotate(35deg);
  		transform: translateY(7px) rotate(35deg);
	}
	.menu-trigger.active span:nth-of-type(2) {
  		opacity: 0;
	}
	.menu-trigger.active span:nth-of-type(3) {
  		-webkit-transform: translateY(-7px) rotate(-35deg);
 		 transform: translateY(-7px) rotate(-35deg);
		width:100% !important;
	}
	
	/*header*/
	header{
		position: fixed;
		top:0;
		left:0;
		width:100%;
		display: flex;
		align-items: center;
		justify-content: space-between;
		z-index:10;
		transition: all 0.2s;
		background:#fff;
	}
	
	header .logo{
		margin:0 0 0 5%;
		width:145px;
		width:175px;
		line-height: 0;
	}
	
	header nav{
		display: none;
		width:100%;
		position: fixed;
		top:50px;
		left:0;
		height:calc(100% - 50px);
		padding:0 0;
		box-sizing: border-box;
		overflow-y: auto;
	}
	
	header nav a{
		margin:0 0 0 0;
		font-weight: 500;
		transition: all 0.2s;
		padding:20px 0;
		width:100%;
		background:#fdd000;
		display: block;
		font-size:1.3rem;
		text-align: center;
		position: relative;
		
	}
	
	header nav a::after{
		content: "";
		width:90%;
		border-bottom:1px solid #d9b100;
		position: absolute;
		bottom:0;
		left:5%;
	}
	
	header a.contactbtn{
		width:50px;
		height:50px;
		background:#1a1a1a;
		color:#fff;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		font-size:1.1rem;
		margin:0 0 0 auto;
	}
	
	header a.contactbtn .icon{
		width:24px;
		margin:0 0 0 0;
		line-height: 0;
	}
	
	header .closebtn{
		width:100%;
		padding:20px 0 30px 0;
		background:#fdd000;
	}
	
	header .closebtn img{
		width:65px;
		margin:0 auto;
	}
	
	
	/*footer*/
	.contact_bottom_area{
		border-top:1px solid #fdd000;
		padding:50px 0;
	}
	
	.contact_bottom_area .innerbox{
		width:100%;
		margin:0 auto;
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
	}
	
	.contact_bottom_area .innerbox .txcont{
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
	}
	
	.contact_bottom_area .innerbox .txcont .sub{
		font-size:1.2rem;
		line-height: 1;
		font-weight: 500;
	}
	
	.contact_bottom_area .innerbox .txcont .txbox{
		display: flex;
		justify-content: center;
		align-items: center;
		flex-direction: column;
		padding:5px 0;
	}
	
	.contact_bottom_area .innerbox .txcont .mtx{
		font-size:4.4rem;
		line-height: 1;
		font-weight: 700;
		display: flex;
		align-items: center;
		flex-direction: column;
	}
	
	.contact_bottom_area .innerbox .txcont .mtx::after{
		content: "";
		width:18px;
		border-bottom:2px solid #fdd000;
		display: block;
	}
	
	.contact_bottom_area .innerbox .txcont .tx{
		font-size:1.2rem;
		line-height: 2.1rem;
		margin:20px 0 30px 0;
		text-align: center;
	}
	
	.contact_bottom_area .btnbox a{
		display:flex;
		flex-direction: column;
	}
	
	.contact_bottom_area .btnbox a span{
		order: -1;
		margin:0 0 10px 0;
	}
	
	footer{
		padding:50px 0 0 0;
		background:#fdd000;
	}
	
	footer .innerbox{
		padding:0 5% 30px;
	}
	
	footer .innerbox .logo{
		width:100%;
		margin:0 auto;
		line-height: 0;
		padding:0 0 5px;
		display: flex;
		box-sizing: border-box;
		justify-content: space-between;
	}
	
	footer .innerbox .logo a{
		width:145px;
		display: block;
	}
	
	footer .innerbox .tx{
		text-align: left;
		font-size:1.2rem;
		line-height: 2.1rem;
	}
	
	footer .copy{
		border-top:1px solid #fff;
		border-bottom:4px solid #fff;
		padding:30px 5% 40px;
		display: flex;
		font-size:1rem;
		flex-direction: column;;
	}
	
	footer .copy .box{
		width:100%;
		font-weight: 500;
		font-size:1.2rem;
	}
	
	footer .box2 .pagetop{
		width:54px;
		height:54px;
		position: relative;
		cursor: pointer;
	}
	
	footer .box2 .pagetop::after{
		content: "";
		width:100%;
		height:100%;
		background:#fff;
		border-radius: 50%;
		position: absolute;
		top:0;
		left:0;
		z-index:1;
		transition: all 0.2s;
		transition: scale(1);
	}
	
	footer .box2 .pagetop:hover::after{
		transform: scale(1.1);
	}
	
	footer .box2 .pagetop::before{
		content:"";
		width:11px;
		height:11px;
		background:url("../images/common/b_arrow.svg") no-repeat;
		background-size:11px;
		display: block;
		transform: rotate(-90deg);
		position: absolute;
		right:calc(50% - 5px);
		top:calc(50% - 5px);
		z-index:2;
	}
	
	/*maincontainer*/
	#maincontainer{
		border-top:50px solid #fff;
	}
	
	/*arrow*/
	.right_arrow_btn{
		display: flex;
		align-items: center;
		font-weight: 500;
	}
	
	.right_arrow_btn span{
		width:54px;
		height:54px;
		display: flex;
		background:#1a1a1a;
		border-radius: 50%;
		justify-content: center;
		align-items: center;
		margin:0 0 0 20px;
		position: relative;
	}
	
	.right_arrow_btn span::before{
		content:"";
		width:10px;
		height:10px;
		background:url("../images/common/w_arrow.svg") no-repeat;
		background-size:10px;
		display: block;
		position: absolute;
		right:calc(50% - 5px);
		top:calc(50% - 5px);
		
	}
	
	.right_arrow_btn span::after{
		content:"";
		width:10px;
		height:10px;
		background:url("../images/common/w_arrow.svg") no-repeat;
		background-size:10px;
		opacity: 0;
		position: absolute;
		right:40px;
		top:calc(50% - 5px);
		
	}
	
	.right_arrow_btn:hover span::before {
  		animation: arrowbefore .25s;
		animation-fill-mode: forwards;
	}
	
	.right_arrow_btn:hover span::after {
  		animation: arrowafter .25s;
		animation-fill-mode: forwards;
		animation-delay: .25s;
	}
	
	.left_arrow_btn{
		display: flex;
		align-items: center;
		font-weight: 500;
	}
	
	.left_arrow_btn span{
		width:54px;
		height:54px;
		display: flex;
		background:#1a1a1a;
		border-radius: 50%;
		justify-content: center;
		align-items: center;
		margin:0 0 0 20px;
		position: relative;
	}
	
	.left_arrow_btn span::before{
		content:"";
		width:10px;
		height:10px;
		background:url("../images/common/w_arrow.svg") no-repeat;
		background-size:10px;
		display: block;
		position: absolute;
		transform: rotate(180deg);
		left:calc(50% - 5px);
		top:calc(50% - 5px);
		
	}
	
	.left_arrow_btn span::after{
		content:"";
		width:10px;
		height:10px;
		background:url("../images/common/w_arrow.svg") no-repeat;
		background-size:10px;
		opacity: 0;
		position: absolute;
		transform: rotate(180deg);
		left:40px;
		top:calc(50% - 5px);
		
	}
	
	.left_arrow_btn:hover span::before {
  		animation: arrowbefore3 .25s;
		animation-fill-mode: forwards;
	}
	
	.left_arrow_btn:hover span::after {
  		animation: arrowafter3 .25s;
		animation-fill-mode: forwards;
		animation-delay: .25s;
	}
	
	.border_arrow_btn{
		display: flex;
		align-items: center;
		font-weight: 500;
		position: relative;
		padding:0 0 10px 10px;
		line-height: 1;
	}
	
	.border_arrow_btn::before{
		content: "";
		width:100%;
		border-bottom:2px solid #1a1a1a;
		position: absolute;
		bottom:0;
		left:0;
		transform: scaleX(1);
		transform-origin: right;
	}
	
	.border_arrow_btn::after{
		content: "";
		width:100%;
		border-bottom:2px solid #1a1a1a;
		position: absolute;
		bottom:0;
		left:0;
		transform: scaleX(0);
		transform-origin: left;
	}
	
	.border_arrow_btn span{
		width:30px;
		height:10px;
		display: flex;
		background:none;
		justify-content: center;
		align-items: center;
		margin:2px 0 0 0;
		position: relative;
	}
	
	.border_arrow_btn span::before{
		content:"";
		width:10px;
		height:10px;
		background:url("../images/common/b_arrow.svg") no-repeat;
		background-size:10px;
		display: block;
		position: absolute;
		right:calc(50% - 5px);
		top:calc(50% - 5px);
		
	}
	
	.border_arrow_btn span::after{
		content:"";
		width:10px;
		height:10px;
		background:url("../images/common/b_arrow.svg") no-repeat;
		background-size:10px;
		opacity: 0;
		position: absolute;
		right:20px;
		top:calc(50% - 5px);
		
	}
	
	.border_arrow_btn:hover span::before {
  		animation: arrowbefore2 .25s;
		animation-fill-mode: forwards;
	}
	
	.border_arrow_btn:hover span::after {
  		animation: arrowafter2 .25s;
		animation-fill-mode: forwards;
		animation-delay: .25s;
	}
	
	.border_arrow_btn:hover::before{
		animation: width1 .25s;
		animation-timing-function: ease-out;
		animation-fill-mode: forwards;
	}
	
	.border_arrow_btn:hover::after{
		animation: width2 .25s;
		animation-delay: 0.25s;
		animation-timing-function: ease-out;
		animation-fill-mode: forwards;
	}
	
	.prev_arrow_btn{
		display: flex;
		align-items: center;
		font-weight: 500;
		position: relative;
		padding:0 0 0 0;
		line-height: 1;
	}
	
	.prev_arrow_btn span{
		width:30px;
		height:10px;
		order:-1;
		display: flex;
		background:none;
		justify-content: center;
		align-items: center;
		margin:2px 0 0 0;
		position: relative;
	}
	
	.prev_arrow_btn span::before{
		content:"";
		width:10px;
		height:10px;
		background:url("../images/common/b_arrow.svg") no-repeat;
		background-size:10px;
		transform: rotate(180deg);
		display: block;
		position: absolute;
		left:calc(50% - 5px);
		top:calc(50% - 5px);
		
	}
	
	.prev_arrow_btn span::after{
		content:"";
		width:10px;
		height:10px;
		background:url("../images/common/b_arrow.svg") no-repeat;
		background-size:10px;
		transform: rotate(180deg);
		opacity: 0;
		position: absolute;
		left:20px;
		top:calc(50% - 5px);
		
	}
	
	.prev_arrow_btn:hover span::before {
  		animation: arrowbefore3 .25s;
		animation-fill-mode: forwards;
	}
	
	.prev_arrow_btn:hover span::after {
  		animation: arrowafter3 .5s;
		animation-fill-mode: forwards;
		animation-delay: .25s;
	}
	
	.next_arrow_btn{
		display: flex;
		align-items: center;
		font-weight: 500;
		position: relative;
		padding:0 0 0 0;
		line-height: 1;
	}
	
	.next_arrow_btn span{
		width:30px;
		height:10px;
		display: flex;
		background:none;
		justify-content: center;
		align-items: center;
		margin:2px 0 0 0;
		position: relative;
	}
	
	.next_arrow_btn span::before{
		content:"";
		width:10px;
		height:10px;
		background:url("../images/common/b_arrow.svg") no-repeat;
		background-size:10px;
		display: block;
		position: absolute;
		right:calc(50% - 5px);
		top:calc(50% - 5px);
		
	}
	
	.next_arrow_btn span::after{
		content:"";
		width:10px;
		height:10px;
		background:url("../images/common/b_arrow.svg") no-repeat;
		background-size:10px;
		opacity: 0;
		position: absolute;
		right:20px;
		top:calc(50% - 5px);
		
	}
	
	.next_arrow_btn:hover span::before {
  		animation: arrowbefore2 .25s;
		animation-fill-mode: forwards;
	}
	
	.next_arrow_btn:hover span::after {
  		animation: arrowafter2 .25s;
		animation-fill-mode: forwards;
		animation-delay: .25s;
	}
	
	.down_arrow_btn{
		display: flex;
		font-weight: 500;
		position: relative;
		padding:0 0 10px 0;
		line-height: 1;
		justify-content: space-between;
		align-items: flex-end;
	}
	
	.down_arrow_btn::before{
		content: "";
		width:100%;
		border-bottom:1px solid #c2c2c2;
		position: absolute;
		bottom:0;
		left:0;
		transform: scaleX(1);
		transform-origin: right;
	}
	
	.down_arrow_btn::after{
		content: "";
		width:100%;
		border-bottom:1px solid #1a1a1a;
		position: absolute;
		bottom:0;
		left:0;
		transform: scaleX(0);
		transform-origin: left;
	}
	
	.down_arrow_btn span{
		width:10px;
		height:10px;
		display: flex;
		background:none;
		justify-content: center;
		align-items: center;
		margin:2px 0 0 0;
		position: relative;
	}
	
	.down_arrow_btn span::before{
		content:"";
		width:10px;
		height:10px;
		background:url("../images/common/b_arrow.svg") no-repeat;
		background-size:10px;
		display: block;
		transform: rotate(90deg);
		position: absolute;
		right:calc(50% - 5px);
		top:calc(50% - 5px);
		
	}
	
	.down_arrow_btn span::after{
		content:"";
		width:10px;
		height:10px;
		background:url("../images/common/b_arrow.svg") no-repeat;
		background-size:10px;
		transform: rotate(90deg);
		opacity: 0;
		position: absolute;
		right:calc(50% - 5px);
		top:-10px;
		
	}
	
	.down_arrow_btn:hover span::before {
  		animation: arrowbefore4 .25s;
		animation-fill-mode: forwards;
		
	}
	
	.down_arrow_btn:hover span::after {
  		animation: arrowafter4 .25s;
		animation-fill-mode: forwards;
		animation-delay: .25s;
	}
	
	.down_arrow_btn:hover::after{
		animation: width2 .5s;
		animation-delay: 0s;
		animation-timing-function: ease-out;
		animation-fill-mode: forwards;
	}
	
	.down_arrow_btn .tx {
  		font-size:1.2rem;
		display: flex;
		flex-direction: column;
	}
	
	.down_arrow_btn .tx num {
  		font-size:0.9rem;
		margin:0 0 5px 0;
	}
	
	/*pan*/
	#pan{
		width:100%;
		background:#fdd000;
		padding:15px 0;
		font-size:1.3rem;
		line-height: 1;
		display: none;
	}
	
	#pan .innerbox{
		width:1100px;
		margin:0 auto;
	}
	
	#pan .innerbox a{
		color:#666;
		text-decoration: underline;
	}
	
	/*page_main_tl*/
	.page_main_tl{
		padding:30px 0 50px 0;
		width:90%;
		margin:0 auto;
		display: flex;
		justify-content: space-between;
		align-items: flex-start;
		flex-direction: column;
	}
	
	.page_main_tl .tlcont{
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		margin:0 0 0 0;
	}
	
	.page_main_tl .tlcont .sub{
		font-size:1.2rem;
		font-weight: 500;
	}
	
	.page_main_tl .tlcont .mtlbox{
		font-size:4.4rem;
		font-weight: 700;
		line-height: 1;
		display: flex;
		flex-direction: column;
		align-items: flex-start;
	}
	
	.page_main_tl .tlcont .mtlbox .mtx{
		padding:0 0 5px 0;
	}
	
	.page_main_tl .tlcont .mtlbox::after{
		content: "";
		width:18px;
		border-bottom:2px solid #fdd000;
		display: block;
	}
	
	.page_main_tl .btnbox{
		display: flex;
		padding:30px 0 0 0;
		justify-content: space-between;
		width:100%;
		flex-wrap: wrap;
	}
	
	.page_main_tl .btnbox a{
		margin:20px 0 0 0;
		width:calc((100% - 20px) / 2);
	}
	
	/*pagenav*/
	.pagenav{
		width:100%;
		text-align: center;
	}
	
	.pagenav .wp-pagenavi{
		padding:40px 0 0 0;
		display: flex;
		justify-content: center;
	}
	
	.pagenav a{
		margin:0 2px;
		border:1px solid #999;
		padding:5px 0;
		border-radius: 5px;
		width:35px;
		height:35px;
		color:#999;
		display: flex;
		justify-content: center;
		align-items: center;
	}
	
	.pagenav a.nextpostslink,
	.pagenav a.previouspostslink{
		text-indent: -9999px;
	}
	
	.pagenav a.nextpostslink::after{
		content: "";
		display: inline-block;
  		width: 8px;
  		height: 8px;
  		margin: 0 0;
  		border-top: 2px solid #999;
  		border-right: 2px solid #999;
  		transform: rotate(45deg);
	}
	
	.pagenav a.previouspostslink::after{
		content: "";
		display: inline-block;
  		width: 8px;
  		height: 8px;
  		margin: 0 0;
  		border-left: 2px solid #999;
  		border-bottom: 2px solid #999;
  		transform: rotate(45deg);
	}
	
	.pagenav a:hover{
		color:#fff;
		background:#1a1a1a;
		border:1px solid #1a1a1a;
	}
	
	.pagenav a.nextpostslink:hover::after{
  		border-top: 2px solid #fff;
  		border-right: 2px solid #fff;
	}
	
	.pagenav a.previouspostslink:hover::after{
  		border-left: 2px solid #fff;
  		border-bottom: 2px solid #fff;
	}
	
	.pagenav span.current{
		margin:0 2px;
		color:#fff;
		background:#1a1a1a;
		border:1px solid #1a1a1a;
		padding:0 0;
		border-radius: 5px;
		width:35px;
		height:35px;
		display: flex;
		justify-content: center;
		align-items: center;
	}
	
	.pagenav span.extend{
		margin:0 2px;
		border:1px solid #999;
		padding:0 0;
		border-radius: 5px;
		width:35px;
		color:#999;
		height:35px;
		display: flex;
		justify-content: center;
		align-items: center;
	}
	
}