@charset "UTF-8";
/* CSS Document */
@media screen and (min-width:768px) {
#header #gnavi .menulist {
	display: block !important;
}
}
@media screen and (max-width:767px) {
body {
	font-size: 1.4rem;
	line-height: 1.8em;
}
.contbox {
	padding: 0 10px;
}
.lowcont {
	padding: 50px 10px;
}
.lowcont2 {
	background-size:100px 130px; 
}
h2.ttl {
	margin: 0 0 30px;
}
.sp_none {
	display: none;
}
/*============================
#header
============================*/
#header {
	height: 60px;
	padding: 13px 10px;
	background: rgba(255,255,255,0.80);
}
#header .logo {
	width: 220px;
	height: 60px;
	float: left;
}
#header #gnavi {
	float: none;
	position: absolute;
	top:0;
	left:0;
	width: 100%;
	z-index: 100;
}
#header #gnavi .btn_menu {
	display: block;
	width: 30px;
	position: absolute;
	top: 13px;
	right: 10px;
	z-index: 101;
}
#header #gnavi .btn_menu span {
	display: block;
	width: 100%;
	height: 3px;
	margin-bottom: 9px;
	background: #000;
}
#header #gnavi .btn_menu.active span {
	display: block;
	width: 100%;
	background: #fff;
	transition: all ease 0.3s;
}
#header #gnavi .menulist {
	display: none;
	width: 100%;
	height: 100vh;
}
#header #gnavi ul {
	width: 100%;
	height: 100vh;
	background: rgba(0,0,0,0.80);
	position: absolute;
	top:0;
	left:0;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-ms-flex-wrap: wrap;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-align-items: center;
  align-items: center;
  -webkit-justify-content: center;
  justify-content: center;
	-webkit-align-content: center;
  align-content: center;
}
#header #gnavi li {
	display: block;
	width: 100%;
	height: auto;
	margin: 0 20px;
	padding: 0;
	text-align: center;
}
#header #gnavi li a {
	font-weight: 700;
	text-decoration: none;
	font-size: 1.6rem;
	line-height: 60px;
	text-align: center;
	color: #fff;
}

.lowttl h1 {
	font-size: 3.6rem;
	text-align: center;
	letter-spacing: 0.2em;
}
.lowttl h1 span {
	display: block;
	font-size: 1.8rem;
}
#pagetop {
	width: 50px;
	height: 50px;
  position: fixed;
  bottom: 10px;
  right: 10px;
}
#pagetop img {
	width: 50px;
	height: 50px;
}

/*============================
btn
============================*/
.nextpage {
	padding: 30px 0;
}
.btn_prev {
	position: static;
}
.btn_account {
	padding: 30px 0;
}
.btn_account a,
.btn_next a {
	display: block;
	width: auto;
	height: 60px;
	margin: 0 20px;
	font-size: 2.4rem;
	line-height: 56px;
	border-radius: 30px 0 30px 0;
}
.btn_prev a {
	width: 60px;
	height: 60px;
	margin: 20px auto 0;
	line-height: 56px;
	border-radius: 30px;
}
_:-ms-lang(x), .btn_account a,
_:-ms-lang(x), .btn_next a,
_:-ms-lang(x), .btn_prev a { 
		line-height: 64px !important;
} 
/*============================
table
============================*/
.table01 {
	border: solid 3px #000;
	border-radius: 20px;
	overflow: hidden;
	margin: 30px 0;
}
.table01 table {
	width: 100%;
	table-layout: fixed;
	font-size: 1.4rem;
	line-height: 1.8em;
}

.table01 th {
	background-color: #f1f3f2;
	padding: 15px 15px 15px 0;
	text-align: left;
}
.table01 td {
	padding: 15px 15px 15px 0;
	border-bottom: solid 3px #f1f3f2;
}
.table01 th:first-child {
	padding: 15px 15px;
}
.table01 td:first-child {
	padding: 15px 15px;
}
/*============================
simulation
============================*/
.select_area {
	display: block;
	padding: 50px 0 30px;
}
.select_area .select_box {
	width: 100%;
	margin-right: 0;
	margin-bottom: 30px
}
.select_area .select_box label {
	width: 100%;
	margin-bottom: 10px;
	display: block;
}
.result .result_value {
	display: block;
}
.result .result_value dl {
	width: 100%;
	text-align: center;
	padding: 20px 10px;
	margin: 0;
}
.result .result_value dl:nth-child(2){
	background-color: #f1f3f2;
}
.result .result_value dl dt {
	display: inline-block;
}
.result .result_value dl dd {
	display: inline-block;
}
.result #fund-fee-app {
	padding: 10px;
}
/*============================
#top
============================*/
#top #header {
	height: 60px;
	padding: 13px 10px;
	background: rgba(255,255,255,0.80);
	border-top: none;
}
#top #keyvisual {
	width: 100%;
	height: auto;
	margin-bottom: 50px;
	background: url(../img/top_keyvisual_pic.jpg) no-repeat center center/cover;
	position: relative;
	padding-bottom: 20px;
}
#top #keyvisual .contbox {
	position: relative;
}
#top #keyvisual .contbox::before {
	display: none;
}
#top #keyvisual .contbox::after {
	display: none;
}
#top #keyvisual .keyvisual_ttl {
	position: relative;
	z-index: 1;
	padding-top: 30px;
	padding-left: 10px;
}
#top #keyvisual .keyvisual_ttl h1 {
	font-size: 3.2rem;
	line-height: 1.2em;
}
#top #keyvisual .keyvisual_ttl h1 .sub {
	font-size: 2.4rem;
}
#top #keyvisual .keyvisual_ttl h1 .small {
	font-size: 2.2rem;
}
#top #keyvisual .robot_pre {
	width: auto;
	max-width: 430px;
	padding-left: 0px;
	position: relative;
	right: 0;
	bottom: 0;
	float: right;
	margin: 30px 0 10px 20px;
}
#top #keyvisual .robot_pre .pic {
	width: 80px;
	height: 80px;
	border-radius: 40px;
	position: absolute;
	top: 0;
	left: 0;
}
#top #keyvisual .robot_pre .text {
	height: auto;
	padding: 10px 15px 10px ;
	border-radius: 40px 0 0 0;
}
#top #keyvisual .robot_pre .text h4 {
	font-size: 1.4rem;
	line-height: 1.8em;
	margin-top: 5px;
	margin-bottom: 20px;
	padding-left: 70px;
}
#top #keyvisual .robot_pre .text h4 span {
	font-size: 1.6rem;
}
#top #keyvisual .robot_pre .text p {
	margin-top: 0;
	margin-bottom: 0;
}

#top #toshin {
	background: url(../img/top_toshin_bg2.png) no-repeat right bottom,
							url(../img/top_toshin_bg_sp.jpg) no-repeat center center / cover;
	padding: 50px 0;
}
#top #toshin .contbox {
	display: block;
}
#top #toshin .contbox .ttl {
	width: auto;
	text-align: center;
	font-size: 3.0rem;
	margin: 0 0 10px;
}
#top #toshin .contbox .ttl .big {
	font-size: 3.0rem;
}
#top #toshin .contbox .ttl .sub {
	font-size: 2.2rem;
}
#top #toshin .contbox .text {
	width:auto;
	padding-left: 0;
	border-left: none;
}
#top #secret .ttl {
	line-height: 2.2em;
	letter-spacing: 0em;
}
#top #secret .ttl .small {
	font-size: 2.2rem;
}
#top #secret .ttl .big {
	font-size: 4.2rem;
}
#top #secret .secret_box {
	display: block;
}
#top #secret .secret_box article .pic {
	margin-bottom: 20px;
}
#top #secret .secret_box article {
	width: auto;
	margin-right: 0;
	margin-bottom: 50px;
	position: static;
	padding-bottom: 0;
}
#top #secret .secret_box article:last-child {
	margin-bottom: 0;
}
#top #secret .secret_box article h3 {
	margin-bottom: 20px;
}
#top #secret .secret_box article .btn_box {
	height: auto;
	position: static;
}

#top #anime .inbox {
	width: 240px;
	height: auto;
	position: absolute;
	top: 50%;
	left: 50%;
	margin-left: -120px;
	margin-top: -150px;
}
#top #anime .logo01 {
	margin: 30px auto;
	float: none;
}
#top #anime .logo02 {
	float: none;
	margin: 30px auto;
}
#top #anime .cross {
	width: 30px;
	height: 30px;
	margin: 30px auto;
	float: none;
}

/*============================
#fund-fee
============================*/
#fund-fee #about {
	display: block;
	margin-bottom: 30px;
}
#fund-fee #about .text {
	width: 100%;
	margin: 0 0 30px;
}
#fund-fee #about .pic {
	width: 100%;
}
#fund-fee_table01 th:nth-child(1){
	width: 55%;
}
#fund-fee_table01 th:nth-child(2){
	width: 45%;
}
#fund-fee_table01 td.lpn {
	padding: 15px 15px 15px 0 !important;
}
#fund-fee_table02 th:nth-child(1){
	width: 35%;
}
#fund-fee_table02 th:nth-child(2){
	width: 65%;
}
/*============================
#factors
============================*/
#factors .dotted li {
	padding: 50px 0;
	list-style: none;
	border-bottom: #ededed dotted 9px;
}
#factors h2.ttl {
	font-size: 2.4rem;
	line-height: 1.4em;
}
#factors .simulation {
	padding: 0;
}
#factors .simulation li {
	width: 100%;
	float: none;
	margin: 50px auto 0;
	padding: 0;
}
#factors p.pic_r,
#factors p.pic_l {
	float: none;
	width: 100%;
	text-align: center;
	margin-bottom: 30px;
	padding: 0;
}
#factors .pic_r img,
#factors .pic_l img {
	max-width: 350px;
	width: 100%;
}
#factors .simulation li .btn_next a  {
    display: block;
    width: auto;
    height: 60px;
    margin: 0 20px;
    font-size: 2.4rem;
    line-height: 56px;
    border-radius: 30px 0 30px 0;
}
}