@charset "utf-8";
@import url(//fonts.googleapis.com/earlyaccess/notosansjapanese.css);

body {
	background: #fff;
	font-family: Helvetica, ArialMT,"Noto Sans Japanese","Hiragino Kaku Gothic ProN","ヒラギノ角ゴ ProN W3",メイリオ,sans-serif;
	color: #000;
	font-size:14px;
	font-weight:400;
}

.mincho{ font-family: serif; }

h1{
	display:none;
}

.background-hack {
    z-index                 : -1;
    background-color        : #fff;
    background-repeat       : no-repeat;
    position                : fixed;
    top                     : 0;
    left                    : 0;
    right                   : 0;
    bottom                  : 0;
}

nav{
	background:rgba(4,31,81,0.7);
	position:fixed;
	top:0;
	width:100%;
	color:#f44889;
}

.main article div.text{
	text-align: center;
	color:#fff;
	line-height:1.6;
	font-weight:bold;
}

.grade{
	background: -moz-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(255,255,255,0) 51%, rgba(255,255,255,1) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top, rgba(255,255,255,0) 0%,rgba(255,255,255,0) 51%,rgba(255,255,255,1) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom, rgba(255,255,255,0) 0%,rgba(255,255,255,0) 51%,rgba(255,255,255,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */
}

footer{
	background:#fff;
}

footer article div.logo p.copyright{
	font-size:10px;
	padding:20px 0 40px;
	color:#333;
}

/*PC*/
@media print, screen and (min-width: 768px)
{

html,body{
	min-width: 940px;
}

.hide_pc{
	display: none;
}
	
a:focus,input:focus,textarea:focus {
	outline: 0;
}
	
a:hover{
	opacity:0.8;
}

.background-hack {
    background-image        : url('../img/bg.jpg');
    background-size         : 2000px;
}

nav article{
	width:940px;
	margin:0 auto;
	text-align: left;
	padding:5px 0;
	position: relative;
}
nav img{
	vertical-align: middle;
	margin:0 2px;
	height:30px;
}

nav article .social{
	position:absolute;
	top:5px;
	right:0;
	padding-left:10px;
}

.main{
	background:#2572a6 url(../img/main_pc.jpg) top center no-repeat;
}
	
.main article,.clearfile article,footer article{
	width:940px;
	margin:0 auto;
	position:relative;
}

.main article div.message_link01{
	position: absolute;
	top:426px;
	right:-60px;
}
	
.main article div.message_link02{
	position: absolute;
	top:512px;
	left:-30px;
}
	
.main article div.text{
	font-size:18px;
	padding-top:625px;
}
	
.main article div.text p{
	margin:35px 0;
}
	
.main article div.text p.sakebe{
	font-size:50px;
	margin:70px 0;
}
	
.main article div.text p.sollogo{
	font-size:50px;
	margin:130px 0 0;
}
	
.main article div.text p.sollogo img{
	width:262px;
}
	
.clearfile{
	background: url(../img/naname.png) top center no-repeat;
	min-height:462px;
}
	
.clearfile article{
	padding-top:250px;
}

.clearfile article ul.text{
	background: url(../img/fukidashi.png)40px 340px no-repeat;
	height:700px;
	display:table;
	width:100%;
}
	
.clearfile article ul.text li{
	display:table-cell;
	vertical-align: top;
}

.clearfile article ul.text li:first-child{
	width:313px;
}

.clearfile article ul.text li:first-child img{
	width:100%;
}
	
.clearfile article ul.text li:last-child{
	padding:20px 0 0 55px;
	text-align: center;
	font-weight:700;
	line-height: 1.6;
	font-size:16px;
}
	
.clearfile article ul.text li:last-child p{
	font-size:55px;
}
	
	
.clearfile article ul.text li:last-child p.bbs{
	margin:35px 0;
}
	
.clearfile article ul.text li:last-child p.bbs img{
	width:450px;
}

footer article{
	padding:100px 0;
	text-align: center;
}
	
footer article div.logo{
	color:#fff;
}
	
footer article div.logo a img{
	vertical-align: middle;
	width:100px;
	margin:0 5px;
}

footer article div.logo p.copyright{
	padding:20px 0 40px;
}

#pagetop{
	display:inline;
	position:fixed;
	bottom:0;
	right:20px;
	opacity:0.7;
	width:50px;
	text-align: right;
	line-height: 0;
}

#pagetop img{
	width:50px;
}

#pagetop img:hover{
	opacity:0.6;
	cursor: pointer;
}
	
}


/*SP*/
@media screen and (max-width: 767px)
{

	
body{
	background-size:100%;
	font-size:12px;
}
	
.hide_sp{
	display: none;
}

img {
	width: 100%;
}

.background-hack {
	background-image        : url('../img/bg_sp.jpg');
	background-size         : 100% auto;
}

nav article{
	padding:8px 5px;
	text-align: left;
}

nav img{
	vertical-align: middle;
	margin:0 2px;
	width: initial;
	height:25px;
}

nav article .social{
	position:absolute;
	top:5px;
	right:5px;
}
	
nav article .social img{
	height:30px;
}

.main{
	background:#2572a6 url(../img/main_sp.jpg) top center no-repeat;
	background-size:100%;
}
	
.arrow{
	position:relative;
	text-align: center;
	height:90vh;
}
	
.arrow div{
	position:absolute;
	bottom:0;
	width:100%;
}
	
.main article.arrow a img{
	width:50%;
}

.main article div.text{
	text-align: center;
	padding:65px 10px 0;
}
	
.main article div.text p{
	margin:20px 0;
	font-size:14px;
}
	
.main article div.text p.sakebe{
	margin:40px 0;
	font-size:20px;
}
	
.main article div.text p.sollogo{
	margin:50px 0 30px;
}
	
.main article div.text p.sollogo img{
	width:60%;
}
	
.main article div.message_link01,.main article div.message_link02{
	padding:10px 10px 0;
}
	
.main article div.message_link02{
	padding-bottom:20px;
}

.clearfile{
	background: url(../img/naname_sp.png) top center no-repeat;
	background-size:100%;
}
	
.clearfile article{
	padding:20px 10px;
}

.clearfile article ul li{
	text-align: center;
}
	
.clearfile article ul li img{
	width:100%;
}

.clearfile article ul.text li:last-child{
	font-weight:700;
	padding:10px 0;
	line-height: 1.6;
}
	
.clearfile article ul.text li:last-child p{
	font-size:24px;
}

.clearfile article ul.text li:last-child p.bbs{
	margin-top:20px;
}

.clearfile article ul.text li:last-child p.bbs img{
	width:100%;
}


footer article div.logo{
	color:#fff;
	font-size:20px;
	text-align: center;
	padding:20px 0 0;
}
	
footer article div.logo a img{
	vertical-align: middle;
	width:30%;
	margin:0 5px;
}

footer article div.logo p.copyright{
	padding:20px 0 ;
}
	
#pagetop{
	display:inline;
	position:fixed;
	bottom:0;
	right:10px;
	opacity:0.7;
	width:20%;
	text-align: right;
	line-height: 0;
}

#pagetop img{
	width:70%;
}
}