@charset "UTF-8";
/* CSS Document */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;500;600&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&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;
}
*{
    min-height: 0;
    min-width : 0;
}
#sl{
    padding: 0;
    font-family: 'Noto Sans JP', sans-serif;
    margin: 0 auto;
    line-height: 2.0;
    font-size: 12px;
    letter-spacing: 1px;
	width: 100%;
    box-sizing: border-box;
    color: #2b2b2b;
    -webkit-text-size-adjust: 100%;
}
#sl a {
	text-decoration: none;
	color: #2b2b2b;
}
#sl　a:hover {
	opacity: 1;
}
#sl .clear{
	clear: both;
}
#sl img{
    width: 100%;
    vertical-align: bottom;
    line-height: 0;
}
#sl ul,#sl li {
	list-style: none;
	padding: 0;
	margin: 0;
}
@media only screen and (min-width: 769px)  {
	#sl {
		font-size: 12px;
        margin: 0 auto;
	}
}
/************************************************
                main 
*************************************************/
#sl .main_visual {
	width: 100%;
    background: #f7f7f7;
	border-top: solid 8px #0000cc;
	border-bottom: solid 8px #0000cc;
	overflow: hidden;
}
#sl .main_visual .top {
    position: relative;
}
#sl .main_visual .top .ttl {
    width: 54%;
	margin: 8% auto 0;
	transition: 1.5s all 0s ease;
}
#sl .main_visual .inner {
    position: relative;
    height: 220vw;
}
#sl .main_visual .inner div {
    position: absolute;
}
#sl .main_visual .inner div:nth-of-type(1) {
    width: 18%;
    top: -13%;
    left: 4%;
}
#sl .main_visual .inner div:nth-of-type(2) {
	width: 22%;
    top: -11.5%;
    right: -1%;
}
#sl .main_visual .inner div:nth-of-type(3) {
	width: 20%;
    top: 1%;
    left: 24%;
}
#sl .main_visual .inner div:nth-of-type(4) {
	width: 34%;
    top: 5%;
    right: 27%;
    z-index: 2;
}
#sl .main_visual .inner .tex {
	width: 17%;
    top: 0%;
    right: 20%;
    transition: 1.5s all 0s ease;
}
#sl .main_visual .inner div:nth-of-type(6) {
	    width: 18.5%;
    top: 15%;
    left: 3%;
}
#sl .main_visual .inner div:nth-of-type(7) {
	width: 26%;
    top: 11%;
    right: -2%;
}
#sl .main_visual .inner div:nth-of-type(8) {
	width: 39%;
    top: 31%;
    left: 21%;
}
#sl .main_visual .inner div:nth-of-type(9) {
	width: 32%;
    top: 28%;
    right: 16%;
}
#sl .main_visual .inner div:nth-of-type(10) {
	width: 29%;
    bottom: 10%;
    left: 0%;
}
#sl .main_visual .inner div:nth-of-type(11) {
	    width: 26%;
    bottom: 1%;
    left: 24%;
}
#sl .main_visual .inner div:nth-of-type(12) {
	width: 50%;
    bottom: 0%;
    right: -3%;
}
@media only screen and (min-width: 769px)  {
	#sl #sl_header {
		padding-top: 60px;
	}      
	#sl .main_visual {
		width: 1080px;
        margin: 0 auto;
		padding: 40px 0 0;
    }
	#sl .main_visual .top .ttl {
		width: 310px;
        margin: 0 auto 0;
	}
	#sl .main_visual .inner {
		height: 950px;
	}
	#sl .main_visual .inner div:nth-of-type(1) {
		width: 9.5%;
        top: -15%;
        left: 10%;
	}
	#sl .main_visual .inner div:nth-of-type(2) {
		width: 12%;
        top: -15%;
        right: 3%;
	}
	#sl .main_visual .inner div:nth-of-type(3) {
        width: 12%;
        top: -8%;
        left: 23%;
    }
	#sl .main_visual .inner div:nth-of-type(4) {
	    width: 18%;
        top: 2%;
        right: 45%;
	}
	#sl .main_visual .inner .tex {
		width: 8.5%;
        top: -3%;
        right: 35%;
	}
	#sl .main_visual .inner div:nth-of-type(6) {
		width: 10%;
		top: 17%;
		left: 4%;
	}
	#sl .main_visual .inner div:nth-of-type(7) {
		width: 14.5%;
        top: -9%;
        right: 14%;
	}
	#sl .main_visual .inner div:nth-of-type(8) {
		width: 22%;
		top: 29%;
		left: 24%;
	}
	#sl .main_visual .inner div:nth-of-type(9) {
		width: 17%;
        top: 17%;
        right: 28%;
	}
	#sl .main_visual .inner div:nth-of-type(10) {
		width: 15%;
        bottom: 2%;
        left: 7%;
	}
	#sl .main_visual .inner div:nth-of-type(11) {
		width: 16%;
        bottom: 2%;
        left: 43%;
	}
	#sl .main_visual .inner div:nth-of-type(12) {
		width: 32%;
		right: 1%;
	}
	
}
/***************************************************
                js
***************************************************/
#sl .anim {
	opacity: 0;
	transition: 1.5s all 0.2s ease;
}
#sl .anim.ac {
	opacity: 1;
	transform: translate(0);
}
/***************************************************
                view
***************************************************/
#sl .spview {
	display: block;
}
#sl .pcview {
	display: none;
}
@media only screen and (min-width: 768px)  {
     #sl .spview {
		display: none;
	}	
	#sl .pcview {
		display: block;
	}
}

#sl .mb_15 {
	margin-bottom: 15px;
}