@charset "UTF-8";
/* CSS Document */
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&display=swap');
body{margin: 0px !important;}
h1,h2,h3,h4,h5,h6{margin: 0;}
ul {
    display: block;
    list-stslideyle-type: disc;
    margin-block-start: 0;
    margin-block-end: 0;
    margin-inline-start: 0;
    margin-inline-end: 0;
    padding-inline-start: 0;
}
#ch{
    padding: 0;
    margin: 0 auto;
	font-family: yu-gothic-pr6n, sans-serif;
    line-height: 2.0;
    font-size: 11px;
    letter-spacing: 1px;
	width: 100%;
    box-sizing: border-box;
    color: #111;
	background: #e7e7e7;
    -webkit-text-size-adjust: 100%;
	overflow: hidden;
}
#ch a {
	text-decoration: none;
	color: #2b2b2b;
}
#ch p {
	margin: 0;
}
#ch　a:hover {
	opacity: 1;
}
#ch .clear{
	clear: both;
}
#ch img{
    width: 100%;
    vertical-align: bottom;
    line-height: 0;
}
#ch ul,#ch li {
	list-style: none;
	padding: 0;
	margin: 0;
}
.f-ja {font-family: yu-gothic-pr6n, sans-serif;}
.f-en {font-family: 'Roboto', sans-serif;}
@media only screen and (min-width: 768px)  {
	#ch {
		overflow: hidden;
	}
}
/************************************************************
                main 
************************************************************/
#ch #ch_header {
	width: 100%;
	margin: 0% auto;
    position: relative;
}
#ch #ch_header .ttl {
	width: 82%;
    margin: 15% auto 8%;
}
@media only screen and (min-width: 768px)  {
	#ch #ch_header {
		margin: 0% auto 0%;
	}
	#ch #ch_header .ttl {
		width: 480px;
		margin: 80px auto 60px
    }
}
/************************************************************
              contents 
************************************************************/
#ch #contents {
	margin: 0% auto 25%;
}
#ch #contents section {
	position: relative;
	padding: 34% 0;
}
#ch #contents section .pic {
	position: absolute;
	width : 44%;
	height: auto;
}
@media only screen and (min-width: 768px) {
	#ch #contents {
		width: 1150px;
		margin: 0 auto;
		margin-bottom: 13%;
	}
	#ch #contents section {
		padding: 280px 0;
	}
	#ch #contents section .pic {
		width: 350px;
	}
}
/************************************************************
              pic
************************************************************/
#ch #contents section:nth-of-type(1) .pic:nth-of-type(1) {
	top: 4%;
	left: -38%;
}
#ch #contents section:nth-of-type(1) .pic:nth-of-type(2) {
	top: 0%;
	left: 3.5%;
}
#ch #contents section:nth-of-type(1) .pic:nth-of-type(3) {
	top: 5%;
    right: 11%;
}
#ch #contents section:nth-of-type(1) .pic:nth-of-type(4) {
	top: 5%;
	right: -32%;
}
@media only screen and (min-width: 768px) {
	#ch #contents section:nth-of-type(1) .pic:nth-of-type(2) {
		left: 0px;
	}
	#ch #contents section:nth-of-type(1) .pic:nth-of-type(3) {
		top: 18px;
        right: 395px;
	}
	#ch #contents section:nth-of-type(1) .pic:nth-of-type(4) {
		top: 14px;
		right: -5px;
	}
}
/******2*******/
#ch #contents section:nth-of-type(2) .pic:nth-of-type(1) {
	top: 3.5%;
	left: -27%;
}
#ch #contents section:nth-of-type(2) .pic:nth-of-type(2) {
	top: 0%;
	left: 16%;
}
#ch #contents section:nth-of-type(2) .pic:nth-of-type(3) {
	top: 4%;
    right: -2.5%;
}
@media only screen and (min-width: 768px) {
	#ch #contents section:nth-of-type(2) .pic:nth-of-type(1) {
		top: 15px;
		left: 60px;
	}
	#ch #contents section:nth-of-type(2) .pic:nth-of-type(2) {
		left: 410px;
	}
	#ch #contents section:nth-of-type(2) .pic:nth-of-type(3) {
		top: 16px;
        right: 40px;
	}
}
/******3*******/
#ch #contents section:nth-of-type(3) .pic:nth-of-type(1) {
	top: 2%;
    left: -36%;
}
#ch #contents section:nth-of-type(3) .pic:nth-of-type(2) {
	top: 0%;
    left: 8%;
}
#ch #contents section:nth-of-type(3) .pic:nth-of-type(3) {
	top: 0%;
    right: 3%;
}
@media only screen and (min-width: 768px) {
	#ch #contents section:nth-of-type(3) .pic:nth-of-type(1) {
		top: 10px;
		left: 0px;
	}
	#ch #contents section:nth-of-type(3) .pic:nth-of-type(2) {
		top: 10px;
		left: 370px;
	}
	#ch #contents section:nth-of-type(3) .pic:nth-of-type(3) {
		right: 88px;
	}
}
/******4*******/
#ch #contents section:nth-of-type(4) .pic:nth-of-type(1) {
	top: 2%;
    left: -3%;
}
#ch #contents section:nth-of-type(4) .pic:nth-of-type(2) {
	top: -1%;
    right: 13%;
}
#ch #contents section:nth-of-type(4) .pic:nth-of-type(3) {
	top: 4%;
    right: -29%;
}
@media only screen and (min-width: 768px) {
	#ch #contents section:nth-of-type(4) .pic:nth-of-type(1) {
		top: 15px;
		left: 62px;
	}
	#ch #contents section:nth-of-type(4) .pic:nth-of-type(2) {
		top: -15px;
		left: 450px;
	}
	#ch #contents section:nth-of-type(4) .pic:nth-of-type(3) {
		top: 16px;
        right: 25px;
	}
}
/******5*******/
#ch #contents section:nth-of-type(5) .pic:nth-of-type(1) {
	top: 2%;
    left: -30%;
}
#ch #contents section:nth-of-type(5) .pic:nth-of-type(2) {
	top: 0%;
    left: 16%;
}
#ch #contents section:nth-of-type(5) .pic:nth-of-type(3) {
	top: 0%;
    right: -4%;
}
@media only screen and (min-width: 768px) {
	#ch #contents section:nth-of-type(5) .pic:nth-of-type(1) {
		top: 10px;
		left: -30px;
	}
	#ch #contents section:nth-of-type(5) .pic:nth-of-type(2) {
		top: 10px;
		left: 370px;
	}
	#ch #contents section:nth-of-type(5) .pic:nth-of-type(3) {
		right: 80px;
	}
}
/******6*******/
#ch #contents section:nth-of-type(6) .pic:nth-of-type(1) {
	top: -1%;
    left: -3%;
}
#ch #contents section:nth-of-type(6) .pic:nth-of-type(2) {
	top: 4%;
    right: 18%;
}
#ch #contents section:nth-of-type(6) .pic:nth-of-type(3) {
	top: -3%;
	right: -26%;
}
@media only screen and (min-width: 768px) {
	#ch #contents section:nth-of-type(6) .pic:nth-of-type(1) {
		top: 0px;
		left: 92px;
	}
	#ch #contents section:nth-of-type(6) .pic:nth-of-type(2) {
		top: 35px;
		left: 450px;
	}
	#ch #contents section:nth-of-type(6) .pic:nth-of-type(3) {
		top: 2px;
        right: 0px;
	}
}
/************************************************************
                js
************************************************************/
/*////pcview////*/
   #ch .spview {
		display: none;
	}	
	#ch .pcview {
		display: block;
	}
@media only screen and (max-width: 768px)  {
	#ch .spview {
		display: block;
	}	
	#ch .pcview {
		display: none;
	}	
}
#ch .mono {
	filter: grayscale(100%);
	transition: .7s all 0s;
	
}
#ch .mono.active {
	filter: none;
}