@charset "UTF-8";

#spFooter #ftCheck {
    font-size: 9px !important;
    line-height: 1.2em;
    padding: 10px 10px 0;
    margin-bottom: 1em;
}
#spFooter address {
    text-align: center;
}
@media screen and (max-width:768px) {
.sp {
	display: block !important;
}
.pc {
	display: none !important;
}
#main {
	margin-top: 13px;
}
#main #sec02,
#main #sec03,
#main #sec04{
	font-size:95%;
}
#main img {
	margin-top: 0;
	margin-bottom: 0;
	height: auto;
	max-width: 100%;
}
#main .img_sp img{
	width: 100% !important;
}
#main section, #main .section {
	width: 98% !important;
	margin: 0 auto;
}
h1 {
	background-color: none !important;
}
.rightTxt {
	text-align: center;
}
.center {
	margin-left: auto;
	margin-right: auto;
	display: block;
	width: 100%;
}
#main .h1-visual {
	width: 100%;
	height: auto;
}
#main .section .catch {
	width: 100%;
	padding: 180px 10px 140px 0;
	background-size: auto 88%;
}
#main .section .catch img {
	width: 40%;
	height: auto;
	margin-right: 0;
}
#main .section .logo {
	margin-top: 1em;
	padding: 0 1em;
	line-height: 1;
}
#main .section .logo img {
	margin-top: .5em
}
#main .about_h1_ttl {
	top: 76px;
	position: relative;
	margin: 0 auto;
	display: block;
	width: 90%;
	height: auto;
}
#main ul.h1-visual-nav-list {
	width: auto;
	margin-left: auto;
	margin-right: auto;
}
#main ul.h1-visual-nav-list li {
	width: 20%;
	margin: 0;
}
#main h1.section {
	width: 100% !important;
	background-color: transparent;
}
#sec01 .h-ttl {
	background-color: #0F228B;
	text-align: center;
	padding-top: 15px;
	padding-bottom: 15px;
	margin-bottom: 2em;
}
#main .sec01-1_img01, #main .sec01-txt01 {
	width: 100%;
	display: block;
}
#sec01 .sec01-h5 img {
	width: 100%;
}
#sec01 .sec01-box-list li {
	width: 100%;
	margin-bottom: 10px;
}
#sec01 .sec01-box-list li img {
	width: 100%;
}
#sec01 .about_sec01-1_img04_sp {
	width: 90% !important;
	margin-bottom: 2em !important;
}
#sec01 ul.sec01-box-list2 li img {
	width: 90% !important;
}
#sec01 .sec01-box-list2 .item-1, #sec01 .sec01-box-list2 .item-2, #sec01 .sec01-box-list2 .item-3 {
	padding-bottom: 1em;
	padding-top: 1.3em;
}
#main #btnblock {
	height: auto;
	background-image: none;
	padding-top: 2em;
	padding-bottom: 4em;
}
body #main a.btn_link {
	margin-bottom: 1em;
	width: 70%;
	padding: 1em 1.8em 1em 1em;
}
#main .btnblock_ttl {
	height: auto;
	top: 0px;
	width: 45%;
	position: relative;
	margin-bottom: 1em;
}
#main .btn_make {
	width: 95%;
	height: auto;
	top: 0px;
}
#sec02 section .read {
	overflow: hidden;
	width: 100%;
	margin: 0 auto;
}
#sec02 section .read p {
	display: block;
	float: left;
	width: 100%;
}
#sec02 section .read img {
	width: 20%;
}
#sec02 section .read .commission_iconblock{
	position: relative;
	z-index: 200;
	top: 0;
	left: 0;
	margin-top: 15px;
	margin-bottom: 60px;
}
#sec02 section .read .commission_icon {
	position: absolute;
	z-index: 300;
	left: 0;
	top: 0;
	box-sizing: border-box;
	font-size: 20px;
	color: #333;
	opacity: 0.9;
	background: -webkit-gradient(linear, left top, right bottom, from(#cce), to(#F7AFCB));
	background: -webkit-linear-gradient(left top, #cce, #F7AFCB);
	background: -moz-linear-gradient(left top, #cce, #F7AFCB);
	background: -o-linear-gradient(left top, #cce, #F7AFCB);
	background: linear-gradient(to left top, #cce, #F7AFCB);
	box-sizing: border-box;
	width: 330px;
	height: 40px;
	margin-bottom: 1em;
	padding: 0 0.5em 0;
	font-weight: bold;
	line-height: 2;
}
#sec02 section .read .commission_icon::after {
	content: "";
	position: absolute;
	z-index: 400;
	top: -3px;
	left: 282px;
	width: 0;
	height: 0;
	border-top: 23px solid rgba(0,0,255,0);
	border-right: 24px solid #FFF;
	border-bottom: 23px solid rgba(0,0,255,0);
	border-left: 24px solid rgba(0,0,255,0);
}
#main section .graph .img_rate {
	width: 100%;
	margin-top: 10%;
}
#main section .course .topix {
	float: none;
	border: 8px solid #425097;
	box-sizing: border-box;
	width: 100%;
	margin: 15px 0;
}

#main section .course .topix_new {
	top: -1.5em;
	width: 35px;
	height: 35px;
}	

#main section .course .voo {
	float: none;
	border: 8px solid #D9A41E;
	box-sizing: border-box;
	width: 100%;
	margin: 15px 0;
}
#main section .course .topix h3, #main section .course .voo h3 {
	display: block;
}
#main section .course .topix .topix_title:after {
	display: block;
	background-color: #425097;
	border-radius: 2px;
	content: "";
 width: calc(100% + -160px);
	height: 4px;
	margin: 18px 0 -4px 80px;
}
#main section .course .voo .voo_title:after {
	display: block;
	background-color: #D9A41E;
	border-radius: 2px;
	content: "";
 width: calc(100% + -160px);
	height: 4px;
	margin: 18px 0 -4px 80px;
}
#sec02 section .commission_iconblock {
    position: relative;
    z-index: 200;
    top: 0;
		left: 0;
    margin-top: 15px;
    margin-bottom: 60px;
}
#main section .course .active, #main section .course .balance {
	width: 100%;
	margin: 15px 0;
}
#main section .course .active img, #main section .course .balance img {
	max-width: 100%;
}
#main section .course .rate {
	margin: 0 0 0 1em;
}
#main section.qa article {
	margin: 1.5em 1em 0;
}
#main .movie .movie_box {
	display: block;
	margin: 1em 0;
	text-align: center;
}
#main .movie .movie_box iframe {
	width: 568px;
	height: 320px;
}
#seclink .h2-ttl,#sec02 .h2-ttl, #sec03 .h2-ttl, #sec04 .h2-ttl {
	padding: 0.8em 10px;
	width:auto !important;
	font-size: 1.5em !important;
}
#main section .course h3 {
	font-size: 1.5em;
}
#sec04 .h2-ttl {
	margin-bottom: 30px;
}
#main section .new_area {
	padding-top: 0;
}
#main section .course{
	margin-top:-15px;
}
#main section .course .topix p.line1,
#main section .course .voo p.line2 {
	height: auto;
}
#main section .new_area small {
	font-size: 0.8em;
}
#main .btn_area a.news{
	padding: 1em;
}
#main .btn_area a.renew{
	padding: 0.8em;
}
#main .btn_area a.renew{
	font-size: 1.3em;
}
#main .btn_area a.renew::after{
	right: 1.0em;
}
#main .unyou_link {
	font-size: 1.1em;
}
#main section a.pdf_noicon {
	background: url(../img/img_link_icon.png) left 10px top 8px no-repeat;
}
#main section article.news a{
	background: url(../img/img_link_icon.png) left 0 top 6px no-repeat;
}
}

@media screen and (max-width:550px) {
#main .h1-visual {
	height: auto;
}
#main .about_h1_ttl {
	top: 100px;
}
#main .section .catch {
	padding: 120px 10px 110px;
}
#main .section .logo {
	margin-top: 1.5em;
}
#main .section .logo img {
	width: 100%;
}
#main section .course .topix .topix_title:after {
 width: calc(100% + -40px);
	margin: 0 0 -4px 20px;
}
#main section .course .voo .voo_title:after {
 width: calc(100% + -40px);
	margin: 0 0 -4px 20px;
}
#main section .course .topix h3, #main section .course .voo h3 {
	display: inline-block;
	font-size: 1.2em;
}
	
#sec02 section .voo .commission_iconblock {
    left: 0;
}
	
#sec02 section .commission_icon {
    font-size: 20px;
    width: 293px;
}

#sec02 section .voo .commission_icon_last {
    left: 245px;
}
	
#main ul.h1-visual-nav-list li a {
	font-size: .7em;
}
#main .btn_area a.start, #main .btn_area a.point , #main .btn_area a.news {
	width: 100%;
}
#main .btn_area a.news {
	font-size: 1.1em;
}
#main .btn_area a.start span.blank {
	font-size: 1.5em;
}
#main .btn_area {
	padding: 1em;
}
#main section p {
	font-size: 1.05em;
	line-height: 1.5;
}
#sec02 section .read p {
	width: 100%;
}
#sec02 section .read img {
	width: 26%;
}
#main section .graph .rate_1y {
	padding: .5em 0;
}
#main section .graph .rate_1y h3 {
	left: 10px;
	font-size: 1.0em !important;
	line-height: 1.1;
	padding-left: 18px;
}
#main section .graph .rate_1y small {
	margin: 2em 0 0 1em;
}
#main section .course .active, #main section .course .balance {
	float: none;
	width: 100%;
}
#main section .course .active {
	margin-bottom: 1em;
}
#main section .course .rate {
	position: relative;
	left: 50%;
	margin: 0 auto;
	display: inline-block;
	transform: translate(-50%, 0);
	-moz-transform: translate(-50%, 0);
	-ms-transform: translate(-50%, 0);
	-o-transform: translate(-50%, 0);
	-webkit-transform: translate(-50%, 0);
}
#main section div.attention {
	margin: 0 1em;
}
#sec01 .btn_area {
	padding: 0;
}
#main section.qa .question_f, #main section.qa .question_m {
	padding: 12px 0 0 4em;
}
#main section.qa .box_q div, #main section.qa .box_a div {
	font-size: .875em;
	padding: 1em;
}
#main section.qa .box_q div::before, #main section.qa .box_a div::before {
	top: -12px;
	width: 24px;
	height: 24px;
	background-size: 100%;
}
#main .movie .movie_box iframe {
	width: 360px;
	height: 180px;
}
#main section .course .topix .topix_graphblock,
#main section .course .topix .topix_graphblock img,
#main section .course .voo .voo_graphblock,
#main section .course .voo .voo_graphblock img,
#main section .course .active img, #main section .course .balance img{
	height: auto;
	padding-bottom:0;
	margin-bottom:0;
}
#sec02{
	margin-top:15px !important;
}
#main section .course .center strong {
	font-size: 1.1em;
}
#main .unyou_link {
	font-size: 1.1em;
}
}

@media screen and (max-width:360px) {
#main .section .catch {
	padding: 100px 10px 30px;
	background-size: auto 88%;
}
#main .h1-visual {
	height: auto;
}
#main .movie .movie_box iframe {
	width: 300px;
	height: 169px;
}
	
#sec02 section .commission_icon {
	font-size: 16px;
	width: 243px;
	line-height: 2.5;
}
	
#sec02 section .voo .commission_icon_last {
    left: 195px;
}
#main .unyou_link {
	font-size: 1.1em;
}
}

@media screen and (max-width:350px) {
#main .h1-visual {
	height: auto;
}
#main .about_h1_ttl {
	top: 70px;
}
#main section p {
	font-size: .875em;
}
#main .section .catch {
	padding: 100px 10px 30px;
	background-size: auto 88%;
}
#main .section .catch img {
	width: 40%;
}
#sec02 section .read p {
	width: 100%;
}
#sec02 section .read img {
	width: 26%;
}
#main section div.attention {
	margin: 0;
}
#main section div.attention ul li {
	font-size: .875em;
}
#main section div.attention h3.h3-ttl {
	font-size: 1em !important;
}
#main .movie .movie_box iframe {
	width: 300px;
	height: 169px;
}
#main .unyou_link {
	font-size: 1.1em;
}

}

/* 201910　追記*/
@media screen and (max-width: 768px){
    #main section .course .kabu ul{
        margin: 0 0 1rem;
        justify-content: space-around;
    }
    #main section .course .kabu ul li{
        margin: 0;
    }
    #main section .course .tatsujin, #main section .course .g-balance {
        width: 100%;
        margin: 15px 0;
    }       
}
@media screen and (max-width:550px) {
    #main section .course .tatsujin, #main section .course .g-balance {
        width: 100%;
        float: none;
    }
    #main section .course .tatsujin {
        margin-bottom: 1em;
    }
}