/* CSS Document */
* {
	font-family: 'Open Sans', Arial, Helvetica, Verdana, sans-serif;
}
body {
	color: #fff;
	overflow-x: hidden;
}
a {
	color: #00A1DE;
}
img {
	max-width: 100%;
	-webkit-backface-visibility: hidden;
}
p {
	font-weight: 300;
	line-height:1.8;
}
.pc-only {

}
.sp-only {
	display: none;
}
h2 {
	font-size: 3.1rem;
	font-weight: 600;
	color: #d9a859;
	text-align: center;
	margin-bottom: 3.8rem;
}
h2 span{
	font-family: Helvetica, 'Open Sans';
	line-height: 2.2;
	border-bottom: 1px solid #d9a859;
	padding-bottom: 1rem;
}
h3 {
	font-family: Helvetica, 'Open Sans';
	font-size: 2.7rem;
	font-weight: 600;
	margin-bottom: 2.4rem;
}
h4 {
	margin-bottom: 1.6rem;
}
ul {
	list-style: none;
	padding-left: 0;
}
.mb0 {
	margin-bottom: 0 !important;
}
.read_more a {
	position: relative;
    display: inline-block;
    padding: 0.6rem 4.5rem 0.7rem;
    color: #fff;
    font-size: 1.2rem;
    font-weight: 400;
    text-decoration: none;
	background: #cb9c53;
	background: -moz-linear-gradient(left,  #cb9c53 0%, #d5a457 100%);
	background: -webkit-linear-gradient(left,  #cb9c53 0%,#d5a457 100%);
	background: linear-gradient(to right,  #cb9c53 0%,#d5a457 100%);
    border-radius: 1.5em;
}
.read_more a::after {
	content: "";
	position: absolute;
	top: calc(50% - 7px);
    right: 20px;
	width: 8px;
	height: 14px;
	background: url(../img/icon_link.png) no-repeat;
	background-size: 8px 14px;
}
.read_more a:hover {
    background: #e6c075;
}
.gradient01 {
	background: #5fbdf3; 
	background: -moz-linear-gradient(left,  #5fbdf3 0%, #69df8f 100%);
	background: -webkit-linear-gradient(left,  #5fbdf3 0%,#69df8f 100%);
	background: linear-gradient(to right,  #5fbdf3 0%,#69df8f 100%); 
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
	text-fill-color: transparent;
}
.gradient02 {
	background: #788af8; 
	background: -moz-linear-gradient(left,  #788af8 0%, #df6bed 100%);
	background: -webkit-linear-gradient(left,  #788af8 0%,#df6bed 100%);
	background: linear-gradient(to right,  #788af8 0%,#df6bed 100%); 
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
	text-fill-color: transparent;
}
.gradient03 {
	background: #8b4ba0; 
	background: -moz-linear-gradient(left,  #8b4ba0 0%, #4082a8 50%, #479a62 100%); 
	background: -webkit-linear-gradient(left,  #8b4ba0 0%,#4082a8 50%,#479a62 100%);
	background: linear-gradient(to right,  #8b4ba0 0%,#4082a8 50%,#479a62 100%); 
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
	text-fill-color: transparent;
}
.lp-block {
	max-width: 1400px;
	position: relative;
	padding: 5rem 6rem;
}


/* content */
header {
	border-bottom: 1px solid #D5D2CA;
	background: #fff;
}
header .lp-block {
	padding: 1rem 2em;
}
header #btn_area {
	margin-bottom: 0;
}
header #btn_area li {
	list-style: none;
	margin-left:10px;
	vertical-align: top;
}
header #btn_area li.fb iframe{
	width: 60px !important;
}
header #btn_area li span.IN-widget {
	vertical-align: top!important;
}
main {
	position: relative;
	min-height: 726px;
	width: 100%;
	height: calc(100vh - 75px);
    background: #1c1c1c;
	overflow: hidden;
}

main .top-op,
main .top-op-bg {
	position: absolute;
	top: 0;
	left: 0;
	margin: 0 auto;
	width: 100%;
	height: calc(100vh - 75px);
	min-height: 726px;
}
main .top-op{
	z-index: 2;
	background: #1c1c1d;
	background-size: cover;
	animation-duration: 4s;
	animation-delay: 0s;
	animation-fill-mode: forwards;
}
main.animation .top-op{
	animation-name: fadeOut;
}
main.skip .top-op {
	opacity: 0;
	transition: all 0.6s;
	animation-name: none;
}
@keyframes fadeOut { 
    0% {opacity: 1} 
    30% {opacity: 1} 
    100% {opacity: 0} 
}
@keyframes fadeIn01 { 
    0% {opacity: 0} 
    90% {opacity: 0} 
    100% {opacity: 1} 
}
@keyframes fadeIn02 { 
    0% {opacity: 0} 
    50% {opacity: 0} 
    100% {opacity: 1} 
}
main .top-op .frame01 {
	visibility: hidden;
	width: 52%;
	position: absolute;
	z-index: 2;
	top: 35%;
	left: 0;
    animation-duration: 2s;
	animation-fill-mode: forwards;
}
main.animation .top-op .frame01{
	visibility: visible;
	animation-name:  top-op-fadeup;
}
main.skip .top-op .frame01 {
	opacity: 0;
	transition: all 0.6s;
	animation-name: none;
}
@keyframes top-op-fadeup {
	from {
	    opacity: 0;
	    transform: translateY(20px);
	}
	to {
	    opacity: 1;
	    transform: translateY(0);
	}
}
main .top-op .frame02 {
	visibility: hidden;
	width: 52%;
	position: absolute;
	top: 0;
	right: 0;
    animation-duration: 2s;
	animation-fill-mode: forwards;
}
main.animation .top-op .frame02{
	visibility: visible;
	animation-name:  top-op-fadeleft;
}
main.skip .top-op .frame02 {
	opacity: 0;
	transition: all 0.6s;
	animation-name: none;
}
@keyframes top-op-fadeleft {
	from {
	    opacity: 0;
	     transform: translateX(100px);
	}
	to {
	    opacity: 1;
	    transform: translateX(0);
	}
}

main .top-op-bg {
	opacity:0;
    background: #1c1c1c url(../img/main_bg.jpg) no-repeat center center;
	background-size: cover;
	animation-duration: 3.5s;
	animation-delay: 1s;
	animation-fill-mode: forwards;
}
main.animation .top-op-bg {
	animation-name: fadeIn02;
}
main.skip .top-op-bg {
	opacity: 1;
	transition: all 0.6s;
	animation-name: none;
}
main .top-op-content {
	position: absolute;
	z-index: 1;
	width: 100%;
	top: 50%;
	left: 0;
	transform: translateY(-50%);
}

main h1 {
	opacity:0;
	padding: 5rem 2rem 0;
	margin-bottom: 32px;
	animation-duration: 3s;
	animation-delay: 0.8s;
	animation-fill-mode: forwards;
}
main.animation h1 {
	animation-name: fadeIn02;
}
main.skip h1 {
	opacity: 1;
	transition: all 0.6s;
	animation-name: none;
}
main .main_image {
	opacity:0;
	padding: 0 2rem;
	margin-bottom: 66px;
	animation-duration: 3.5s;
	animation-delay: 0.8s;
	animation-fill-mode: forwards;
}
main.animation .main_image {
	animation-name: fadeIn02;
}
main.skip .main_image  {
	opacity: 1;
	transition: all 0.6s;
	animation-name: none;
}
main .scrolldown1 {
	opacity:0;
    position: absolute;
    left: 50%;
    bottom: 30px;
    height: 50px;
	animation-duration: 2.2s;
	animation-delay: 1.4s;
	animation-fill-mode: forwards;
}
main.animation .scrolldown1 {
	animation-name: fadeIn01;
}
main.skip .scrolldown1 {
	opacity: 1;
	transition: all 0.6s;
	animation-name: none;
}
main .scrolldown1 span {
    position: absolute;
    left: -7px;
    top: -24px;
    color: transparent;
    font-size: 0.7rem;
    letter-spacing: 0.05em;
	width: 14px;
	height: 24px;
	background: url(../img/icon_scrolldown.png) no-repeat;
	background-size: contain;
}
main .scrolldown1::after {
    content: "";
    position: absolute;
    top: 0;
    width: 1px;
    height: 30px;
    background: #eee;
    animation: pathmove 1.4s ease-in-out infinite;
    opacity: 0;
}
@keyframes pathmove{
  0%{
    height:0;
    top:0;
    opacity: 0;
  }
  30%{
    height:30px;
    opacity: 1;
  }
  100%{
    height:0;
    top:50px;
    opacity: 0;
  }
}
#main_nav {
    position: relative;
    z-index: 3;
}
#main_nav .lp-block{
	padding: 0;
}
nav {
	opacity: 0;
	overflow: hidden;
	margin-top: -40px;
	margin-bottom: -54px;
	animation-duration: 2.2s;
	animation-delay:1.4s;
	animation-fill-mode: forwards;
}
nav.animation {
	animation-name: fadeIn01;
}
nav.skip {
	opacity: 1;
	transition: all 0.6s;
	animation-name: none;
}
nav .main_nav {
	position: relative;
	display: inline-block;
	margin-left: -30px;
}
nav .main_nav .main_nav_bg {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	transform: skewX(-20deg);
	background: #cb9c53;
	background: -moz-linear-gradient(left,  #cb9c53 0%, #d5a457 100%);
	background: -webkit-linear-gradient(left,  #cb9c53 0%,#d5a457 100%);
	background: linear-gradient(to right,  #cb9c53 0%,#d5a457 100%);
}
nav .main_nav ul {
	margin-bottom: 0;
	position: relative;
	z-index: 1;
}
nav .main_nav ul li {
	position: relative;
}
nav .main_nav ul li:first-child {
	width: 60%;
}
nav .main_nav ul li:last-child {
	width: 40%;
}
nav .main_nav ul li::after {
	content: "";
	position: absolute;
	top: 0;
	right: 0;
	height: 88px;
	border-right: 1px solid #282828;
	transform: skewX(-20deg);
}
nav .main_nav ul li:last-child::after {
	content: none;
}
nav .main_nav ul a {
	color: #fff;
	font-size: 20px;
	padding: 29px 119px 29px 100px;
	white-space: nowrap;
}
nav .main_nav ul li:last-child a {
	padding: 29px 129px 29px 90px;
}
nav .main_nav ul a:hover {
	text-decoration: none;
	opacity: 0.7;
}
nav .main_nav ul a::after {
    content: "";
    width: 18px;
    height: 11px;
    background: url(../img/icon_linkbottom.png) no-repeat;
    background-size: 18px 11px;
    position: absolute;
    top: calc(50% - 5px);
    right: 60px;
}
#sub_nav {
    transition: opacity .15s linear;
}
#sub_nav.fixed{
	position: fixed;
	z-index: 2;
	top: 0;
	left: 0;
	right: 0;
	padding: 0 6rem;
	width: 100%;
    max-width: 1400px;
	text-align: center;
	margin-left: auto;
	margin-right: auto;
}
.sub_nav {
	position: relative;
	margin-top: 10px;
}
.sub_nav .sub_nav_bg {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	transform: skewX(-20deg);
	background: #8b4ba0; 
	background: -moz-linear-gradient(left,  #8b4ba0 0%, #4082a8 50%, #479a62 100%); 
	background: -webkit-linear-gradient(left,  #8b4ba0 0%,#4082a8 50%,#479a62 100%);
	background: linear-gradient(to right,  #8b4ba0 0%,#4082a8 50%,#479a62 100%); 
}
.sub_nav ul {
	margin-left: 20px;
    margin-right: 20px;
	margin-bottom: 0;
	position: relative;
	z-index: 1;
}
.sub_nav ul li {
	position: relative;
}
.sub_nav ul li::after {
	content: "";
	position: absolute;
	top: calc(50% - 20px);
	right: -20px;
	height: 40px;
	border-right: 1px solid #ffffff;
	transform: skewX(-20deg);
}
.sub_nav ul li:last-child::after {
	content: none;
}
.sub_nav ul a {
	color: #fff;
	font-size: 18px;
	padding: 20px 50px 20px 40px;
	text-align: left;
}
.sub_nav ul a:hover {
	text-decoration: none;
	opacity: 0.7;
}
.sub_nav ul a::after {
    content: "";
    width: 18px;
    height: 11px;
    background: url(../img/icon_linkbottom.png) no-repeat;
    background-size: 18px 11px;
    position: absolute;
    top: calc(50% - 5px);
    right: 16px;
}
#sec01 {
	background: url(../img/sec01_bg_top.png) no-repeat top left,
    #27292b url(../img/sec01_bg_bottom.png) no-repeat bottom right;
	overflow: hidden;
}
#sec01 .lp-block {
    padding: 5rem 6rem 0;
	perspective: 1000;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}
#sec01 .lp-block:last-child {
	padding-bottom: 5rem;
}
#sec01 img {
	perspective: 1000;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}
#sec01 h2 {
	letter-spacing: 3px;
}
#sec01 p {
	color: #8b8b8b;
}
#sec01-01 {
	position: relative;
}
#sec01-01:after {
	content: "";
	position: absolute;
	z-index: -1;
	top: 40%;
	left: 50%;
	width: 5px;
	height: 5px;
	box-shadow: -2px 0px 140px 140px #fff;
	border-radius: 100px;
	opacity: 0.3;
}
#sec01-05 {
	position: relative;
}
#sec01-05:after {
	content: "";
	position: absolute;
	z-index: -1;
	top: 40%;
	left: 55%;
	width: 5px;
	height: 5px;
	box-shadow: -2px 50px 80px 80px #fff;
	border-radius: 100px;
	opacity: 0.2;
}
#sec01 .video_canvas{
	display: inline-block;
	position: relative;
}
#sec01 .video_canvas video {
	position: absolute;
	width: 80.9%;
	top: 11.5%;
    left: 9.7%;
}
#sec01-04 .apng_canvas{
	display: inline-block;
	position: relative;
}
#sec01-04 .apng_canvas .apng {
	position: absolute;
	width: 80.9%;
	width: 33%;
	top: 10.2%;
	left: 39%;
}
#sec01-05 .apng_shadow{
	display: inline-block;
	background: url(../img/sec01-05_shadow.png) no-repeat left bottom / cover ;
}
#sec01-05 .apng_shadow img {
	padding-bottom: 4%;
}
.ie #sec01-01 h3 {
	color: transparent;
	background: transparent url(../img/sec01-01title.png) no-repeat;
	width: 93px;
}
.ie #sec01-02 h3 {
	color: transparent;
	background: transparent url(../img/sec01-02title.png) no-repeat;
	width: 259px;
}
.ie #sec01-03 h3 {
	color: transparent;
	background: transparent url(../img/sec01-03title.png) no-repeat;
	width: 335px;
}
.ie #sec01-04 h3 {
	color: transparent;
	background: transparent url(../img/sec01-04title.png) no-repeat;
	width: 195px;
}
.ie #sec01-05 h3 {
	color: transparent;
	background: transparent url(../img/sec01-05title.png) no-repeat;
	width: 420px;
}
.ie #sec01-06 h3 {
	color: transparent;
	background: transparent url(../img/sec01-06title.png) no-repeat;
	width: 405px;
}
.monitor_image {
	background: #1f2022;
}
.monitor_image .bx-wrapper {
    -moz-box-shadow: none;
    -webkit-box-shadow: none; 
    box-shadow: none;
    border: 5px solid transparent;
    background: transparent; 
}
#sec02 {
	background: #181819;
}
#sec02 .article_block {
	background: #242527;
	padding: 3.6rem;
	border-radius: 1em;
	margin-bottom: 30px;
	box-shadow: 0px 0px 15px 2px #000000;
}
#sec02 .article_block .date {
	font-weight: 400;
}
#sec02 .article_block h3 {
	font-size: 1.9rem;
	margin-bottom: 1.8rem;
}
#sec02 .article_block .article_thumb {
	margin-top: 3rem;
}
#sec02 .article_block .article_text {
	margin-bottom: 1.8rem;
}
.ie #sec02 h3.gradient03 {
	color: transparent;
	background: transparent url(../img/comingsoon.png) no-repeat;
}
#sec03 {
	background: #383838 url(../img/sec03_bg.png) no-repeat top -180px center;
}
#sec03 .product_image {
	margin: 0 1.7rem 2rem;
}
#sec03 .read_more {
	margin-bottom: 0.4rem;
}
#sec03 .product_releaseDate {
	color: #8b8b8b
}
#sec04 {
	background: #171819;
}
#sec04 h3 {
	margin-bottom: 5rem;
}
#sec04 .bnr-link {
    position: relative;
    display: inline-block;
	max-width: 100%;
}
#sec04 .bnr-link::after {
    content: "";
    display: block;
    position: absolute;
    width: 117px;
    height: 36px;
    bottom: 12px;
    right: 20px;
    margin-top: -20px;
    background: url(../img/btn_learnmore.png) no-repeat center center;
    background-size: contain;
}
#sec04 .bnr-link:hover {
	opacity: 0.7;
}
footer {
	color: #fcfcfc;
	font-weight: 300;
	background: #070707;
	padding: 3rem 0 4rem;
}
.fadeIn {
	opacity: 0;
	transition-duration: 800ms;
	transition-property: opacity, transform;
	overflow: hidden;
}
.fadeIn-up {
	transform: translate(0, 100px);
}
.fadeIn-down {
	transform: translate(0, -100px);
}
.fadeIn-left {
	transform: translate(-100px, 0);
}
.fadeIn-right {
	transform: translate(100px, 0);
}
.scrollIn {
	opacity: 1;
	transform: translate(0, 0);
}
@media screen and (max-width: 1300px) {
	.lp-block {
		padding: 3rem 2rem;
	}
	#sec01 .lp-block {
		padding: 3rem 2rem 0;
	}
	#main_nav .main_nav {
		margin-left: 20px;
		margin-right: 20px;
		max-width: 90%;
	}
	nav .main_nav ul a {
	    padding: 29px 70px 29px 50px;
	}
	#sub_nav.fixed {
		padding: 0 2rem;
		margin-left: 0;
	}
	.sub_nav {
		margin-left: 0;
	}
	.sub_nav ul a {
	    font-size: 15px;
	    padding: 20px 40px 20px 25px;
	}
	.sub_nav ul a::after {
	    right: 6px;
	}
}
@media screen and (max-width: 960px) {
	.sub_nav ul li::after {
		right: -10px;
	}
	.sub_nav ul a {
	    font-size: 15px;
	    padding: 20px 10px;
	}
	.sub_nav ul a::after {
		width: 18px;
	    height: 11px;
	    background: url(../img/icon_linkbottom.png) no-repeat;
	    background-size: 18px 11px;
	    position: absolute;
	    top: auto;
	    bottom: 5px;
	    right: auto;
		left: calc(50% - 9px);
	}
}
@media screen and (max-width: 768px) {
	.pc-only {
		display: none;
	}
	.sp-only {
		display: block;
	}
	h2 {
	    font-size: 1.9rem;
	}
	h3 {
	    font-size: 1.9rem;
	}
	h4 {
	    font-size: 1.3rem;
	}
	p {
		font-size: 0.9rem;
		line-height: 1.4;
	}
	header .lp-block {
	    padding: 1rem;
	}
	footer div {
		font-size: 0.9rem;
	}
	main .top-op .frame01 {
		width: 70%;
		top: 45%;
	}
	main .top-op .frame02 {
		width: 70%;
		right: -14%;
	}
	main .top-op-bg {
		background: #1c1c1c url(../img/main_bg_sp.png) no-repeat center center;
		background-size: cover;
	}
	main .main_image {
		padding-bottom: 3rem;
	}
	#main_nav {
		/*background: #1c1c1c;*/
	}
	nav {
	    opacity: 1;
	    animation-name: none;
		margin-top: 0;
		margin-bottom: -80px;
	}
	nav .main_nav ul a {
	    font-size: 0.9rem;
	    padding: 15px 40px 15px 20px;
	}
	nav .main_nav ul li:last-child a {
	    padding: 15px 50px 15px 20px;
	}
	nav .main_nav ul a::after{
		right: 15px;
	}
	.sub_nav ul li {
		width: 30%;
	}
	.sub_nav.sp01 li:nth-child(2) {
		width: 35%;
	}
	.sub_nav.sp01 li:nth-child(3) {
		width: 35%;
	}
	.sub_nav.sp02 li:nth-child(2) {
		width: 33%;
	}
	.sub_nav.sp02 li:nth-child(3) {
		width: 36%;
	}
	.sub_nav.sp01 .sub_nav_bg {
		background: #8b4ba0 ;
	    background: -moz-linear-gradient(left, #8b4ba0 0%, #4082a8 100%);
	    background: -webkit-linear-gradient(left, #8b4ba0 0%,#4082a8 100%);
	    background: linear-gradient(to right, #8b4ba0 0%,#4082a8 100%);
	}
	.sub_nav.sp02 .sub_nav_bg {
		background: #4082a8 ;
	    background: -moz-linear-gradient(left, #4082a8 0%, #479a62 100%);
	    background: -webkit-linear-gradient(left, #4082a8 0%,#479a62 100%);
	    background: linear-gradient(to right, #4082a8 0%,#479a62 100%);
	}
	.sub_nav ul li::after {
	    right: 10px;
	}
	.sub_nav ul a {
		font-size: 0.8rem;
	    padding: 15px 40px 15px 10px;
	}
	.sub_nav ul a::after {
	    top: calc(50% - 5px);
		bottom: auto;
	    right: 20px;
		left:auto;
	}
	.sub_nav ul li:last-child a::after {
	    right: 10px;
	}
	#sec01 #sec01-01 > .d-flex,
	#sec01 #sec01-03 > .d-flex,
	#sec01 #sec01-05 > .d-flex  {
	  	-webkit-box-orient: vertical;
	  	-webkit-box-direction: reverse;
	  	-ms-flex-direction: column-reverse;
		flex-direction: column-reverse;
	}
	#sec01 #sec01-02 > .d-flex,
	#sec01 #sec01-04 > .d-flex,
	#sec01 #sec01-06 > .d-flex {
	  	-webkit-box-orient: vertical;
	  	-webkit-box-direction: normal;
	  	-ms-flex-direction: column;
		flex-direction: column;
	}
	#sec01 #sec01-01 > .d-flex > div,
	#sec01 #sec01-02 > .d-flex > div,
	#sec01 #sec01-03 > .d-flex > div,
	#sec01 #sec01-04 > .d-flex > div,
	#sec01 #sec01-05 > .d-flex > div ,
	#sec01 #sec01-06 > .d-flex > div{
		width: 100%;
		max-width: 100%;
		flex: 1 auto;
		text-align: center;
	}
	#sec01 h3 {
		margin-top: 1.6rem;
		margin-bottom: 1.4rem;
	}
	#sec01 p {
		text-align: left;
	}
	#sec01-01 {
	    background-position: -100px -100px;
	    background-size: 400px;
	}
	.ie #sec01 h3 {
		margin-left: auto;
		margin-right: auto;
		background-size: contain;
	}
	#sec02 .article_block {
		padding: 1.6rem;
	  	-webkit-box-orient: vertical;
	  	-webkit-box-direction: reverse;
	  	-ms-flex-direction: column-reverse;
		flex-direction: column-reverse;
	}
	#sec02 .article_block > div {
		width: 100%;
		max-width: 100%;
		flex: 1 auto;
	}
	#sec02 .article_block h3 {
		font-size: 1.5rem;
		margin-bottom: 1.4rem;
	}
	#sec02 .article_block .article_thumb {
	    margin-top: 0;
		margin-left: auto;
		margin-right: auto;
		margin-bottom: 1rem;
		display: block;
	}
	#sec03 .d-flex {
		flex-direction: column;
	}
	#sec03 .d-flex > div {
		width: 100%;
		max-width: 100%;
		flex: 1 auto;
		margin-bottom: 2rem;
	}
	#sec03 .d-flex > div:last-child {
		margin-bottom: 0;
	}
	#sec04 h3 {
	    margin-bottom: 2rem;
	}
	#sec03 .col {
	    background: url(../img/sec01_light.png) no-repeat center;
		background-size: 400px;
	}
	.read_more {
		text-align: center;
	}
	.read_more a {
		font-size: 1rem;
	}
}
@media screen and (max-width: 630px) {
	main, main .top-op, main .top-op-bg {
		min-height: 600px;
	}
}
@media screen and (max-width: 420px) {
	h4 {
	    font-size: 1.1rem;
	}
	main, main .top-op, main .top-op-bg {
		min-height: 450px;
		height: auto;
	}
	.scrolldown1 {
		display: none;
	}
	.sub_nav ul a {
		font-size: 0.6rem;
	    padding: 10px 30px 15px 0;
	}
	.sub_nav ul a::after {
	    width: 9px;
	    height: 6px;
	    background: url(../img/icon_linkbottom.png) no-repeat;
	    background-size: 9px 6px;
   		 top: calc(50% - 3px);
	}
	.sub_nav ul li:last-child a::after {
	    right: 0;
	}
	.lp-block {
		padding: 2.4rem 1rem;
	}
	footer div {
		font-size: 0.7rem;
	}
}