@charset "UTF-8";

html,body {
	overflow-x: hidden;
	overflow-y: visible;
}
body {
	font-size:20px;
	margin: 0;
	padding: 0;
	line-height:2;
    color: #052e4c;
    font-family: 'Avenir','Helvetica Neue','Helvetica','Arial','Hiragino Sans','ヒラギノ角ゴシック',YuGothic,'Yu Gothic','メイリオ', Meiryo,'ＭＳ Ｐゴシック','MS PGothic';
	-webkit-text-size-adjust: 100%;
}
a, a:link, a:visited, a:hover, a:active {
	text-decoration: none;
	color: #949494;
}
h1, h2, h3 {
 	margin: 0;
	padding: 0;
	font-weight: normal;
}
img {
	max-width: 100%;
	height: auto;
	vertical-align: bottom;
}
.w_50 {
	width: 50%;
	margin: 0 auto;
}
.w_60 {
	width: 60%;
	margin: 0 auto;
}
.w_70 {
	width: 70%;
	margin: 0 auto;
}
.w_80 {
	width: 80%;
	margin: 0 auto;
}
.blue {
    color: #00a0e9;
}
.red {
    color: #ff0000;
    font-weight: bold;
}

.p0 { padding: 0 !important;}
.p5 {padding: 5% 0 !important;}
.p8 {padding: 8% 0 !important;}
.p10 {padding: 10% 0 !important;}

.pt0 { padding-top: 0 !important;}
.pt1 { padding-top: 1% !important;}
.pt3 { padding-top: 3% !important;}
.pt5 { padding-top: 5% !important;}
.pt8 { padding-top: 8% !important;}
.pt10 { padding-top: 10% !important;}

.pb0 { padding-bottom: 0 !important;}
.pb1 { padding-bottom: 1% !important;}
.pb3 { padding-bottom: 3% !important;}
.pb5 { padding-bottom: 5% !important;}
.pb8 { padding-bottom: 8% !important;}
.pb10 { padding-bottom: 10% !important;}

.mt0 { margin-top: 0 !important;}
.mt1 { margin-top: 1% !important;}
.mt2 { margin-top: 2% !important;}
.mt3 { margin-top: 3% !important;}
.mt5 { margin-top: 5% !important;}
.mt8 { margin-top: 8% !important;}
.mt10 { margin-top: 10% !important;}

.mb0 { margin-bottom: 0 !important;}
.mb1 { margin-bottom: 1% !important;}
.mb3 { margin-bottom: 3% !important;}
.mb5 { margin-bottom: 5% !important;}
.mb8 { margin-bottom: 8% !important;}
.mb10 { margin-bottom: 10% !important;}
.mb20 { margin-bottom: 20% !important;}

/*--------------------------------------
全体用*/
.inner {
	width: 100%;
	max-width: 900px;
	margin: 0 auto;
    padding: 8% 8% 30%;
    background-color: #fff;
}
h2 {
	padding-bottom: 5%;
	text-align: center;
    font-weight: bold;
    color: #052e4c;
    font-size: 138%;
}
.logo {
    width: 25%;
	margin: 0 auto 15%;
}
.txt {
	padding-bottom: 5%;
}
.txt:last-child {
	padding-bottom: 0;
}
.btn:hover{
    opacity: 0.8;
}
.btn01:hover{
    opacity: 0.8;
}

/*--------------------------------------
menu*/

.mini-text{font-size:8px;}/*文字大きさ*/

ul.bottom-menu {
    position: fixed;
    left:0;
    bottom:0;
    width: 100%;
    height:60px;/*高さ*/
    margin:0 0 -2px 0;
    padding:0;
    background-color:#052e4c;/*背景色*/
    border-image-slice: 1;
    z-index:30;}

ul.bottom-menu li {
    float:left;
    width:20%;
    background-color:#052e4c;/*背景色*/
    list-style-type:none;
    text-align:center;
    font-size:25px;/*アイコンのサイズ*/}

.bottom-menu li a {
    display: block;
    color:#fff;/*アイコン＆文字の色*/
    padding-top:10px;
    padding-bottom:5px;
    line-height:10px;
    text-decoration:none;}

.bottom-menu li .active {
    display: block;
    color:transparent;/*アイコン＆文字の色*/
    padding-top:10px;
    padding-bottom:5px;
    line-height:10px;
    text-decoration:none;
    background: #d9c009;
    -webkit-background-clip: text;

  }


.bottom-menu li a:hover {
    color:#a9a9a9;/*マウスオーバー時の色*/}

/* === 展開メニュー === */

ul.menu-second-level {
    visibility: hidden;
    opacity: 0;
    z-index:1;}

ul.menu-second-level li a{
    border-top:1px dashed #a9a9a9;/*展開の枠点線*/
        font-size:15px;/*展開メニューの文字サイズ*/
        line-height:30px;/*文字の縦幅*/}

.menu-second-level li a:hover {
    height:100%;
    background: lightgrey;/*マウスオーバーの色*/}

li.menu-width-max ul.menu-second-level {
    position: absolute;
    bottom: 47px;/*高さ*/
    left: 0;
    box-sizing: border-box;
    width: 100%;
    padding:0;}

li.menu-width-max:hover ul.menu-second-level {
    bottom: 47px;/*高さ*/
    visibility: visible;
    opacity: 1;}

li.menu-width-max ul.menu-second-level li {
    float: left;
    width: 100%;
    border: none;}


/*--------------------------------------
login用*/
#login .logo {
    width: 30%;
	margin: 0 auto 10%;
}
#login .box {
    width: 90%;
    margin: 0 auto 5%;
    padding: 8%;
    border:1px solid #052e4c;
    text-align: left;
}
#login .logo {
    width: 30%;
	margin: 0 auto 10%;
}
#login .btn01 {
    width: 50%;
	margin: 0 auto;
}
#login .btn {
    width: 90%;
	margin: 0 auto 3%;
}
/*--------------------------------------
ログイン用*/
.login_form_area {
    width: 90%;
    margin: 0 auto;
}
.login_inputbox {
    height: 50px;
    padding: 3% 8%;
    margin-bottom: 10%;
    border-radius: 30px;
    border:1px solid #052e4c;
}
.login_btn {
    width: 70%;
    margin: 0 auto;
}
.login_mbb {
    margin-bottom: 20%;
}

/*--------------------------------------
assets用*/
#assets h1 {
    padding-bottom: 15%;
    font-weight: bold;
    color: #052e4c;
    font-size: 128%;
}
#assets .assets_box {
    display: flex;
    padding-bottom: 1%;
    margin-bottom: 5%;
	justify-content: space-between;
    border-bottom:1px solid #052e4c;
}
#assets .fb {
    font-size: 128%;
}
#assets .graph {
    width: 80%;
	margin: 0 auto;
}

/*--------------------------------------
assets用*/
#history .history_box {
    display: flex;
    padding: 1.5% 0;
    margin-bottom: 0.8%;
	justify-content: space-between;
    font-size: 80%;
    line-height: 1.3;
    border-top:1px solid #052e4c;
}
#history .history_box:last-child {
    border-bottom:1px solid #052e4c;
}
#history .history_box_in .boxin02 {
    text-align: right;
}
#history .fb {
    font-size: 128%;
    font-weight: bold;
}
/*--------------------------------------
market用*/

.tab-wrap {
  display: flex;
  flex-wrap: wrap;
  margin:20px 0;
}
.tab-wrap:after {
  content: '';
  width: 100%;
  height: 3px;
  background: #052e4c;
  display: block;
  order: -1;
}
.tab-label {
  color: #fff;
  background: #d7e1ea;
  line-height: 1;
  font-size:80%;
  text-shadow: 0 -1px 0 rgba(0,0,0,.2);
  white-space: nowrap;
  text-align: center;
  padding: 4% .5em;
  order: -1;
  position: relative;
  z-index: 1;
  cursor: pointer;
  border-radius: 5px 5px 0 0;
  flex: 1;
}
.tab-label:not(:last-of-type) {
  margin-right: 5px;
}
.tab-content {
  width: 100%;
  height: 0;
  overflow: hidden;
  opacity: 0;
}
/* アクティブなタブ */
.tab-switch:checked+.tab-label {
  background: #052e4c;
}
.tab-switch:checked+.tab-label+.tab-content {
  height: auto;
  overflow: auto;
  opacity: 1;
  transition: .5s opacity;
  font-size: 80%;
}
/* ラジオボタン非表示 */
.tab-switch {
  display: none;
}
#market .market_box {
    display: flex;
	justify-content: space-between;
}
.bg_blue {
    padding: 3%;
    background-color: #d7e1ea;
}
.bg_white {
    padding: 3%;
    background-color: #f6f6f6;
}
#market .red {
    color: #ff0000;
    font-weight: normal;
}
.market_txt_r {
    text-align: right;
    line-height: 1.1;
}


/*--------------------------------------
bank用*/
#bank .tab-content {
    background-color: #f6f6f6;
}
.bank_box {
    padding: 5%;
}
#bank h1 {
    padding-bottom: 5%;
    font-size: 118%;
}
.bank_txt01 {
    padding-bottom: 3%;
}
dd {
    padding-bottom: 3%;
    margin-bottom: 3%;
    border-bottom:1px solid #dadada;
}
.input_box {
    height: 30px;
    border:none;
    background-color: #fff;
}
input {
    width: 100%;
}
.select {
  appearance: none; /* ① */
  -webkit-appearance: none;
  -moz-appearance: none;
  border: 1px solid #aaa; /* ② ここから */
  border-radius: 4px;
  padding: 2%;
  width: 100%;
  cursor: pointer; /* ② ここまで */
}

.select:disabled {
  pointer-events: none;
  background-color: #f1f1f1;
  color: #aaa;
}

.select-wrapper {
  position: relative;
  display: inline-block;
  width: 100%;
}

.select-wrapper::after {  /* ③ */
  content: '';
  position: absolute;
  border: 4px solid #333;
  border-bottom: 0;
  border-left-color: transparent;
  border-right-color: transparent;
  top: calc(50% - 3px);
  right: 10px;
  width: 0;
  height: 0;
}

.select-wrapper--disabled::after {
  border-top-color: #aaa;
}

textarea{
box-sizing:border-box;
-moz-box-sizing:border-box; /* Firefox */
-webkit-box-sizing:border-box; /* Chrome, Safari */
}
input[type="text"]{
  width: 100%;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
input[type="email"]{	
  width: 100%;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
input[type="submit"],
input[type='button'] {
	width: 100%;
	height: 90px;
}

/* iOSでのデフォルトスタイルをリセット */
input[type="submit"],
input[type="button"] {
  border-radius: 0;
  -webkit-box-sizing: content-box;
  -webkit-appearance: button;
  appearance: button;
  border: none;
  box-sizing: border-box;
  cursor: pointer;
}
input[type="submit"]::-webkit-search-decoration,
input[type="button"]::-webkit-search-decoration {
  display: none;
}
input[type="submit"]::focus,
input[type="button"]::focus {
  outline-offset: -2px;
}

/*--------------------------------------
trial用*/
.trial_box {
    padding:15% 8%;
    background-color: #052e4c;
}
.trial_txt {
    text-align: center;
    font-weight: bold;
    font-size: 138%;
    color: #fff;
}
/*--------------------------------------
qa用*/
#qa h1 {
    padding-bottom: 8%;
    text-align: center;
    font-weight: bold;
    font-size: 138%;
}
.accordion {
    width: 100%;
    margin-bottom: 10px;
    border-radius: 5px;
    background-color: #fff;
}

.accordion summary {
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: relative;
    padding: 1em 1em 1em 3.5em;
    color: #fff;
    font-size: 80%;
    font-weight: 600;
    cursor: pointer;
    background: url("../images/q.png")no-repeat center left/40px auto;
    background-color: #052e4c;
}

.accordion summary::-webkit-details-marker {
    display: none;
}

.accordion summary::after {
    transform: translateY(-25%) rotate(45deg);
    width: 7px;
    height: 7px;
    margin-left: 10px;
    border-bottom: 3px solid #fff;
    border-right: 3px solid #fff;
    content: '';
    transition: transform .3s;
}

.accordion[open] summary::after {
    transform: rotate(225deg);
}

.accordion p {
    transform: translateY(-10px);
    opacity: 0;
    margin: 0;
    padding: 3% 2% 5%;
    color: #052e4c;
    font-size: 80%;
    transition: transform .5s, opacity .5s;
}

.accordion[open] p {
    transform: none;
    opacity: 1;
}

/*--------------------------------------
フッター用*/
footer {
	text-align: center;
	font-size: 60%;
	padding:3% 0;
	color: #fff;
	line-height: 1.5;
	background-color: #000;
}
footer a,footer a:link,footer a:visited,footer a:hover,footer a:active {
	text-decoration: none;
	color: #fff;
}

/*--------------------------------------
レスポンシブ*/

@media screen and (min-width: 800px){
	.sp{display:none;}
	br.sp {display: none;}
}
@media print, screen and (max-width: 800px) {
	body {
		font-size: 100%;
		line-height: 1.6;
	}
	.pc {
		display: none;
	}
	br.sp {
		display: block;
	}
	#menu2{
		width: 100%;
		position: fixed;
		bottom: 0;
		left: 0;
		z-index: 9999;
	}
	#menu2 img {
		width: 100%;
	}
	footer {
		padding: 2% 0;
	}
	.w_45 {width: 60% !important; margin: 0 auto}
	.w_50 {width: 60% !important; margin: 0 auto;}
	.w_60 {width: 80% !important; margin: 0 auto;}
	.w_70 {width: 100% !important; margin: 0 auto;}
	.w_80 {width: 100% !important; margin: 0 auto;}
	.w_40_sp {width: 40% !important; margin: 0 auto;}
	.w_45_sp {width: 45% !important; margin: 0 auto;}
	.w_50_sp {width: 50% !important; margin: 0 auto;}
	.w_60_sp {width: 60% !important; margin: 0 auto;}
	.w_70_sp {width: 70% !important; margin: 0 auto;}
	.w_80_sp {width: 80% !important; margin: 0 auto;}

}
@media print, screen and (max-width: 800px) and (min-width: 640px) {
	body {
		font-size: 118%;
	}
	br {
		display: block;
		content: none;
	}
}