@charset "utf-8";
/* CSS Document */

@media (min-width: 749px){

/*ここからがリセットcss*/
/*
html5doctor.com Reset Stylesheet
v1.6.1
Last Updated: 2010-09-17
Author: Richard Clark - http://richclarkdesign.com
Twitter: @rich_clark
*/

html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
    margin:0;
    padding:0;
    border:0;
    outline:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
}

body {
    line-height:1;
}

article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section {
    display:block;
}

nav ul {
    list-style:none;
}

blockquote, q {
    quotes:none;
}

blockquote:before, blockquote:after,
q:before, q:after {
    content:'';
    content:none;
}

a {
    margin:0;
    padding:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
}

/* change colours to suit your needs */
ins {
    background-color:#ff9;
    color:#000;
    text-decoration:none;
}

/* change colours to suit your needs */
mark {
    background-color:#ff9;
    color:#000;
    font-style:italic;
    font-weight:bold;
}

del {
    text-decoration: line-through;
}

abbr[title], dfn[title] {
    border-bottom:1px dotted;
    cursor:help;
}

table {
    border-collapse:collapse;
    border-spacing:0;
}

/* change border colour to suit your needs */
hr {
    display:block;
    height:1px;
    border:0;  
    border-top:1px solid #cccccc;
    margin:1em 0;
    padding:0;
}

input, select {
    vertical-align:middle;
}

/*ここまでがリセットcss*/

#top01{
    position: relative;
	width: 100%;
	margin-left: auto;
	margin-right: auto;
}
#randomImgB{
	display: none;
}
/*#randomImg{
	width: 100%;
	height: auto;
}*/
	#randomImg img{
		width: 100%;
		height: auto;
	}
	#topLogo{
	display: flex;
	position: absolute;
	top: 2vw;
    float: left;
	padding-left: 3vw;
}
#logo01{
	width: 20%;
	height:20%;
	padding-right: 2vw;
}
#logo02{
	width: 30%;
	height: 50%;
	padding-left: 2vw;
}
#topLogoText{
	text-align: center;
	font-size: 1.5vw;
	font-family: Verdana, Geneva, "sans-serif";
	font: bold;
	color: #122b58;
}

/* ここはコピーしなくてOK　*/
.container {
  font-family: "Yu Gothic", YuGothic, Verdana, 'Hiragino Kaku Gothic ProN','Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ Pro W3', 'メイリオ', Meiryo, sans-serif;
  text-align: center;
  margin-top: 3vw;;
}


/* ここから下がボタンのCSS　*/
.btn {
  display: inline-block;
  max-width: 50%;
  text-align: center;
  background-color: #00b87e;
  font-size: 150%;
  color: #FFFFFF;
  text-decoration: none;
  font-weight: bold;
  padding: 30px 30px;
  border-radius: 50px;
  transition: .4s;
  letter-spacing: 0.05em;
  margin-bottom: 40px;
}
.btn:hover {
      cursor: pointer;
	 text-decoration: none;
	-webkit-animation: btn 0.5s both;
	-moz-animation: btn 0.5s both;
	        animation: btn 0.5s both;
}
@-webkit-keyframes btn{
  0% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  100% {
    -webkit-transform: scale(1.1);
            transform: scale(1.1);
	}
}
@-moz-keyframes btn{
  0% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  100% {
    -webkit-transform: scale(1.1);
            transform: scale(1.1);
	}
}
@keyframes btn {
  0% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  100% {
    -webkit-transform: scale(1.1);
            transform: scale(1.1);
	}
}

/* ここまでがボタンのCSS　*/

#co_02{
		width: 100%;
	padding-top: 5%;
	padding-bottom: 3%;
	-webkit-background: linear-gradient(to bottom, #b1e86d, #f5f5bc, #FFF);
	-moz-background: linear-gradient(to bottom, #b1e86d, #f5f5bc, #FFF);
	background: linear-gradient(to bottom, #b1e86d, #f5f5bc, #FFF);
}	

#spTitle{
	display: block;
	margin: 0 auto;
	width: 30vw;
}
	#box01_A{
		display:flex;
		margin-left: auto;
		margin-right: auto;
	}
.box01{
	width: 40vw;
	height: 40vw;
	background-color: #FFFFFF;
	margin-left: auto;
	margin-right: auto;
	margin-top: 5%;
	margin-bottom: 2%;
}
	.box01_B{
	width: 90vw;
	height: 40vw;
	background-color: #FFFFFF;
	margin-left: auto;
	margin-right: auto;
	margin-top: 2%;
	margin-bottom: 5%;
	}	
.sp01{
	width: 20vw;
	margin-left: 1.5%;
	margin-top: 1.5%;
}
.box01 p{
	text-align: center;
	font-size: 2.0vw;
	line-height: 2rem;
	font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
	position: relative;
	top: -5vw;
	font-weight: bolder;
	color: #224b9a;
}
	.box01_B p{
	text-align: center;
	font-size: 2.0vw;
	line-height: 2rem;
	font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
	position: relative;
	top: -12vw;
	font-weight: bolder;
	color: #224b9a;
	}
#sp03Text{
	color: #ff2e4c;
	font-size: 3.5vw;
	font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
	position: relative;
	margin-top: 3vw;
    text-align: center;
	letter-spacing: 0.5%;
	font-weight: bold;
}
#sp02_a{
	width: 40vw;
	margin-top: -3vw;
	margin-left: auto;
	margin-right: auto;
	display: block;
}
#sp02_b{
	width: 30vw;
	margin-top:-2vw;
	margin-left: auto;
	margin-right: auto;
	display: block;
}
#sp02_c{
	width:30vw;
	margin-top: -10vw;
	margin-left: auto;
	margin-right: auto;
	display: block;
}
.box02{
	width: 80vw;
	height: 20vw;
	background-color: #FFFFFF;
	margin-left: auto;
	margin-bottom: 5vw;
	margin-right: auto;
	border: solid #224b9a;
	padding: 3% 5%;
	border-width: 1.0vw;
}
.box03{
	width: 80vw;
	height: 30vw;
	background-color: #FFFFFF;
	margin-left: auto;
	margin-bottom: 5vw;
	margin-right: auto;
	border: solid #224b9a;
	padding: 3% 5%;
   border-width: 1.0vw;
}
	.st01{
		float: left;
		width: 20%;
		padding-top: 8vw;
		padding-right: 5vw;
	}
hr{
	display: none;
}
	.v_line_fix {
  margin-left: 20vw;
  margin-top: 0vw;
  width: 0.5vw;
  height: 20vw;
  background-color: #224b9a;
}
		.v_line2_fix {
  margin-left: 20vw;
  margin-top: 0vw;
  width: 0.5vw;
  height: 30vw;
  background-color: #224b9a;
}
	#box02_A{
		clear: both;
		position:relative;
		top: -20vw;
	}
		#box02_B{
		clear: both;
		position:relative;
		top: -30vw;
	}
.box02 h3{
	text-align: center;
	font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
	color: #224b9a;
	font-size: 3.5vw
	}
.box03 h3{
	text-align: center;
	font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
	color: #224b9a;
	font-size: 3.5vw;
}
.st02{
	display: block;
	font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
	color: #224b9a;
	font-weight: bolder;
	font-size: 1.5vw;
	margin-top: 1.5vw;
	line-height: 2.0em;
	width: 60vw;
	margin-left:22vw;
}
	.st03{
	display: block;
	font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
	color: #224b9a;
	font-weight: bolder;
	font-size: 1.5vw;
	margin-top: 1.5vw;
	line-height: 2.0em;
	width: 60vw;
	margin-left:22vw;
}
#st_LINE{
	display: block;
	margin: 0 auto;
	width: 50vw;
	margin-top: 2vw;
	padding-right: 5vw;
}
	#co_03{
	width: 100%;	
}
#co_03_title{
	display: block;
	margin: 0 auto;
	width: 60vw;
	margin-bottom: 3vw;
	}
#co_03_text{
	text-align: center;
	font-size: 1.5vw;
	line-height: 2em;
	font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
	color: #224b9a;
	font-weight: bolder;
	font: italic;
}
.co_03_a{
	width: 80vw;
	height: 20vw;
	background-color: #FFFFFF;
	margin-left: auto;
	margin-bottom: 5vw;
	margin-top: 5vw;
	margin-right: auto;
	border: solid #b1e86e;
	border-width: 1.0vw;
	padding: 3% 3%;	
}
	.co_03_a2{
	width: 80vw;
	height: 25vw;
	background-color: #FFFFFF;
	margin-left: auto;
	margin-bottom: 5vw;
	margin-top: 5vw;
	margin-right: auto;
	border: solid #b1e86e;
	border-width: 1.0vw;
	padding: 3% 3%;	
}
	.co_03_a2 p{
	font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
	color: #224b9a;
	font-size: 3.0vw;
	font-weight: bold;
	font:italic;
	padding-top: 1.0vw;
	padding-left:20vw ;
}
.co_03_a p{
	font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
	color: #224b9a;
	font-size: 3.0vw;
	font-weight: bold;
	font:italic;
	padding-top: 1.0vw;
	padding-left:25vw ;
}
.co_03_b{
	display: flex;
	justify-content: center;
}
#co_03_imgA{
	width: 40vw	;
	height: 100%;
	display: block;
	padding-right: 5vw;
}
#co_03_imgB{
	width: 30vw	;
	height: 100%;
	display: block;
	padding-right: 4vw;
}
#co_03_imgC{
	width: 40vw	;
	height: 100%;
	display: block;	
	padding-right: 10vw;
}
.co_03_c{
	font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
	color: #224b9a;
	font-size: 1.7vw;
	padding-top: 1.5vw;
	line-height: 4.5vw;
}
	#co_04{
		background-color: #b1e86e;
		padding-top: 5vw;
		width: 100%;
	}
	#co_04_title{
		display: block;
		margin: 0 auto;
		width: 60vw;
		padding-bottom: 5vw;
	}
	#co04A{
		display: flex;
        width: 100%;
	}
 
	.co_04a{
		display: inline-block;
		vertical-align: top;
		box-sizing: border-box;
		background-color: #FFF;
		width: 25vw;
		height: auto; 
		position: relative;
		left: 6vw;
		margin-left: 3vw;
	}
	
	.co_04_imgA{
		display: block;
		margin-left: auto;
		margin-right: auto;
		width: 18vw;
		padding-top: 5vw;
	}
	.co_04a p{
		text-align: center;
		margin: 3vw 0;
		font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
	    color: #224b9a;
	    font-size: 1.5vw;
		font-weight: bold;
	}

	#co_04_p01{
		font-size:1.1vw;
	}
	.co_04b span{
		display: block;
		text-align: center;
		font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
	    color: #224b9a;
	    font-size: 0.8vw;
		font-weight: bold;
		line-height: 2em;
		margin-left: auto;
		margin-right: auto;
	}
	.co_04b img{
		display:block;
		margin-left: auto;
		margin-right: auto;
		width: 15vw;
	}
	.co_04c{
		font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
	    color: #224b9a;
	    font-size: 1.0vw;
		line-height: 2.0em;
		padding:1.5vw 3vw 0 3vw;
	}
	.co_04d{
		text-align: center;
		color: #f08712;
		font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
		font-size: 1.2vw;
		line-height: 1.5em;
		font-weight: bold;
		padding-bottom: 3vw;
		margin-top: 1.5vw;
	}
	footer{
		background-color: #b1e86e;
	}
	#footerText{
		text-align: center;
		font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
	    color: #224b9a;
	    font-size: 0.7vw;
		line-height: 2.0em;
		font-weight: bold;
		padding-bottom: 5vw;
	}
