@import url(http://fonts.googleapis.com/css?family=Quicksand:400,300,700);
@import url(https://fonts.googleapis.com/css?family=Montserrat);

/* --------------------------------------------------------------
	 Typography
---------------------------------------------------------------*/
body {
    font-family: Quicksand, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Meiryo UI", メイリオ, Meiryo, 游ゴシック, "Yu Gothic", 游ゴシック体, YuGothic, sans-serif;
    letter-spacing: 0.04em;
    color: #333;
}
header h1 {
    font-size: 14px;
    line-height: 1.5em;
    text-align: right;
    color: #fff;
    font-weight: bold;
}
section.total_desc h2 {
    font-size: 40px;
    line-height: 1.4;
    font-family: Montserrat, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Meiryo UI", メイリオ, Meiryo, 游ゴシック, "Yu Gothic", 游ゴシック体, YuGothic, sans-serif;
    color: #fff;
    font-weight: bold;
}
h1,h2, h3, p.h2_sub_txt, a {
    font-family: Montserrat;
}
h2 {
    letter-spacing: .04em;
    font-size: 50px;
    font-weight: bold;
    color: #00518B;
}
p.h2_sub_txt {
    font-size: 72px;
    color: #D92119;
    font-weight: 800;
    letter-spacing: .1em;
    padding-bottom: .2em;
    margin-bottom: 1em;
}
p {
	font-size: 16px;
	line-height: 1.6;
}
p.desc {
    font-size: 20px;
}
.update_04 p.desc {
    font-size: 16px;
}
.update_03 p,
.update_03 h2,
section.total_desc p,
section.total_desc h3{
    text-shadow: 1px 1px 10px #111;
}
.update_03 .h2_sub_txt span,
.update_03 h2,
.update_03 h2 + p {
    color: #fff;
}
p.h2_sub_txt span {
    color: #043050;
    padding-left: .2em;
}
h3 {
    font-size: 24px;
    text-align: center;
    color: #00518B;
}
section.update_04 h3 {
    text-align: left;
    font-size: 32px;
}
section.update h3 + p {
    text-align: justify;
}
section.total_desc h3 {
    font-size: 26px;
    color: #F5361C;
    text-align: left;
}
dd {
    line-height: 1.8;
    letter-spacing: .04em;
}
.emphasis_inline_01 {
    font-size: 1.6em;
    color: #0C165C;
    border-bottom: 2px solid;
}
.emphasis_inline_02 {
    font-size: 2em;
    color: #13365F;
    border-bottom: 5px solid #F3DB09;
    margin: .5em 0 1em;
    display: inline-block;
    line-height: 1;
    font-weight: bold;
}

/* --------------------------------------------------------------
	 General Style
---------------------------------------------------------------*/
a {
	color: #D92119;
}
a:hover, a:focus,.btn:hover {
	text-decoration: none;
	-moz-transition: background-color, color, 0.3s;
	-o-transition: background-color, color, 0.3s;
	-webkit-transition: background-color, color, 0.3s;
	transition: background-color, color, opacity, 0.3s;
}
a:link,
a:visited,
a:active,
a:hover { /* For FireFox Link*/
	overflow: hidden;
	outline: none;
}
ul, ol {
	margin: 0;
	padding: 0;
}
ul li {
	list-style: none;
}
.section {
	padding: 100px 0;
}

.no-padding {
	padding: 0;
}
.no-gutter [class*=col-] {
	padding-right: 0;
	padding-left: 0;
}
img {
    display: block;
    max-width: 100%;
    height: auto;
}
.ml_auto {
    margin-left: auto;
}

.m_l_r_auto {
    margin-left: auto;
    margin-right: auto;
}

.mb_1em {
    margin-bottom: 1em;
}
.mb_2em {
    margin-bottom: 2em;
}
.mb_3em {
    margin-bottom: 3em;
}
.opacity_05 {
    opacity: .5;
}

/* --------------------------------------------------------------
	 header and main visual
---------------------------------------------------------------*/
body {
    background: url(../images/bg_main_01.jpg) no-repeat top center;
}
header h1 {
    margin-top: 0;
    padding: 1em;
    margin-bottom: 0;
}
.header_line {
  background-image: -moz-linear-gradient( 0deg, rgb(0,81,139) 0%, rgb(2,50,85) 50%, rgb(4,106,179) 83%, rgb(2,94,159) 91%, rgb(0,81,139) 100%);
  background-image: -webkit-linear-gradient( 0deg, rgb(0,81,139) 0%, rgb(2,50,85) 50%, rgb(4,106,179) 83%, rgb(2,94,159) 91%, rgb(0,81,139) 100%);
  background-image: -ms-linear-gradient( 0deg, rgb(0,81,139) 0%, rgb(2,50,85) 50%, rgb(4,106,179) 83%, rgb(2,94,159) 91%, rgb(0,81,139) 100%);
  height: 50px;
  width: 100%;
}
section.main_visual {
    padding: 0;
}
.main_visual_wrap {
    background: url(../images/main_right.png) no-repeat;
    height: 642px;
}
.main_visual_wrap img.main_visual_desc  {
    padding-top: 40px;
    margin-bottom: 24px;
}
section.main_visual h2 {
    margin: 0;   
}
a.logo img {
    position: absolute;
    top: 0;
    z-index: 100;
}
nav li {
    text-align: center;
    color: #111;
    font-weight: bold;
    font-size: 16px;
}

/* --------------------------------------------------------------
	 update
---------------------------------------------------------------*/
.update {
    padding-top: 100px;
}
h2 {
    margin-bottom: 1em;
}
.update .h2_sub_txt:after {
    position: absolute;
    top: 2em;
    left: 50%;
    content: '';
    width: 2em;
    height: 2px;
    margin-left: -1em;
    background-color: #111;
}
.update_01 {
    background: url(../images/bg_btcusd.png) no-repeat left 10px top 30px;
}
.update_02 {
    background: url(../images/bg_quickstart.png) no-repeat right 10px top 30px;
}
.update_03 {
    background: url(../images/bg_server.png) no-repeat left 10px top 30px;
}
.update_04 {
    background: url(../images/bg_support.png) no-repeat right 10px top 30px;
}

.cta {
    background: url("../images/bg_cta_01.png");
    padding: 100px 15px;
    border-top: #EEEDF3 1px solid;
    -moz-box-shadow: 0 0 18px rgba(0, 0, 0, .25);
    -webkit-box-shadow: 0 0 18px rgba(0, 0, 0, .25);
    box-shadow: 0 0 18px rgba(0, 0, 0, .25);
}

/* update 01 */
.update_01 .update_inner {
padding-bottom: 50px;
}

/* update 02 */
.update_02 .update_inner_second {
    padding-top: 60px;
    background-size: 1374px;
    background-color: rgba(173, 242, 251, 0.23);
    border-top: solid 1px rgba(33, 150, 243, 0.18);
}

/* update 03 video */
section.update_03 {
    padding-top: 0;
}
.update_03 .update_inner {
    position: relative;
    padding-top: 100px;
}
#video {
    position: absolute;
    right: 0;
    bottom: 0;
    min-width: 100%;
    min-height: 100%;
    width: 100%;
    height: 100%;
    z-index: -2;
    background-size: cover;
    background: #111;
}
section.update_03 .pattern {
    width: 100%;
    height: 100%;
    background: url(../images/yokojima.png);
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
}

/* update 04 */
section.update_04 {
    background-color: rgba(173, 242, 251, 0.23);
}
section.update_04 h3 {
    margin-bottom: 1em;
    background: url(../images/ico_bt_04.png) no-repeat;
    padding-left: 74px;
    background-size: contain;
}

/* --------------------------------------------------------------
	 total_desc
---------------------------------------------------------------*/
section.total_desc {
    background: url(../images/bg_total_desc.jpg) no-repeat center top #111;
    background-size: cover;
    color: #fff;
}
section.total_desc .container{ 
    padding-bottom: 50px;
}
section.total_desc h2 {
    margin-bottom: 60px;
    min-height: 4em;
}

/* --------------------------------------------------------------
	 attention
---------------------------------------------------------------*/
section.attention {
    padding: 100px 0;
}
section.attention .container {
    width: 800px;
    max-width: 100%;
}
section.attention dt,
section.attention dd {
    margin-bottom: 1em;
}
section.attention dt{
    border-bottom: solid 1px;
}


/* --------------------------------------------------------------
	 link
---------------------------------------------------------------*/
a.btn_01:hover img, a.btn_02:hover img, cta a:hover img, button img:hover {
    box-shadow: 0 0 30px rgba(0, 0, 0, .35);
    opacity: 0.9;
    transition: 0.3s;
}
#pagetop {
    position: fixed;
    bottom: 10px;
    right: 10px;
    font-size: 16px;
    width: 100px;
    margin: 0px;
    border-radius: 100px;
    background: #fff;
    text-align: center;
    padding: 1em;
    box-shadow: 0px 1px 2px #ccc;
    height: 100px;
    font-weight: bold;
}
 #pagetop a {
    line-height: 2;
    display: block;
}

/* --------------------------------------------------------------
	 Footer
---------------------------------------------------------------*/
.footer {
    text-align: left;
    padding-top: 50px;
    padding-bottom: 50px;
    background: url("../images/bg_footer.png");
    background: #023961;
    color: #fff;
}
.footer p {
    font-size: 12px;
}
.copyright {
    text-align: center;
    padding: 1em;
}
footer h4 {
    font-size: 16px;
    border-bottom: solid 1px;
    padding-bottom: .5em;
}

/* --------------------------------------------------------------
	 contact
---------------------------------------------------------------*/
body.contact_page {
    background-attachment: fixed;
    background-size: cover;
}
.contact_page p.attention {
    text-align: center;
    background: rgba(255, 0, 0, 0.15);
    padding: 1em;
    border-radius: .2em;
    margin-right: .5em;
    border: solid 1px rgba(247, 138, 133, 0.68);
}
.contact_page p.attention span{
    background: #D92119;
    padding: .2em;
    color: #fff;
    margin-right: .5em;
}
.form-group {
    margin-bottom: 1em;
}
.contact {
	margin: auto;
}
.contact h3 {
    font-weight: normal;
    font-size: 30px;
    border-bottom: dashed 1px;
    padding-bottom: .4em;
    text-align: left;
    margin-bottom: 1em;
}
label {font-weight: normal;}

label.must:after {
    content: "必須";
    padding-left: .5em;
    color: #e84545;
    font-weight: bold;
}
.form-horizontal .control-label {
    padding-top: 2px;
    color: #00518A;
    font-size: 1.3em;
}
.contact p {
    margin-bottom: 1.4rem;
}
.contact .btn {
    background-color: #333;
    margin: 40px 0;
    color: #fff;
    font-size: 14px;
    border-radius: 2px;
    padding: 3% 12%;
    display: inline-block;
    letter-spacing: 2px;
}
.contact .btn:hover, .btn:focus {
	background-color: #000;
}
.contact .btn-large {
	padding: 15px 40px;
}
.contact .contact dt{
    line-height: 2;
}
.contact .contact dd {
    border-bottom: solid 1px #DCD9D9;
    margin-bottom: .8em;
    padding-bottom: .6em;
    line-height: 2;
    /* box-shadow: 1px 0px 0px #fff; */
    /* border-right: solid 1px #DCD9D9; */
}
#contact form button {
    background: none;
    border: none;
    -webkit-appearance: none;
    margin: 40px auto 0;
    display: block;
    padding: 0;
}

/* --------------------------------------------------------------
	 responsive
---------------------------------------------------------------*/

/* -------------------------
   480px以上 
------------------------- */
@media screen and (min-width: 480px) {
    
header {
    position: fixed;
    z-index: 100;
}
section.main_visual {
    padding-top: 50px;
}
section.update_01 {
    padding-top: 0;
}
    
/* スマホ以上　非表示 */
.pc_hidden {
        display: none;
}
}

/* -------------------------
   768px以下 
------------------------- */
@media screen and (max-width: 768px) {
section.update_04 h3 {
    background-size: 15vw;
    font-size: 5vw;
}
}

/* -------------------------
   480px以下 
------------------------- */
@media screen and (max-width: 480px) {

body.lp_02 {
    background-image: none;
    background-color: #fff;
}
header.header_line {
    height: 40px;
}
header h1 {
    padding: .5em 0 0 0;
    font-size: 10px;
}
header a.logo img {
    height: 40px;
    width: auto;
}
.main_visual_wrap > div {
    padding: 0 5px 0;
    background: #E6F1FB;
}  
.main_visual_wrap {
    background: none;
    height: auto;
}
.main_visual_wrap img.main_visual_desc {
    padding-top: 10px;
    margin-bottom: 10px;

}
a.btn_01 {
    padding-top: 38vw;
    margin-left: 0;
}

/* 各updateの背景画像 */
.update_01, .update_02, .update_03, .update_04 {
    padding-top: 6vh;
    background-image: none;
}  
.update_02 .update_inner_second {
    padding-top: 30px;
}
.update_03 {
    background-image: none;
}
.update_03 .update_inner {
    padding-top: 6vh;
}  
section.attention {
    padding: 30px 0;
}  
section.update h3 + p, section.total_desc p {
    text-align: left;
    font-size: 14px;
}
p.desc {
    font-size: 16px;
}
p.h2_sub_txt {
    font-size: 12vw;
    color: #D92119;
}
h2 {font-size: 8vw;}

h3 {font-size: 6vw;}
    
section.update_04 h3 {
    font-size: 6vw;
}
section.total_desc h2 {
    font-size: 8vw;
    line-height: 1.4;
    letter-spacing: 0.09em;
}
dd {
    line-height: 1.6;
    letter-spacing: .04em;
    font-size: 10px;
}
section .cta {
    padding: 10vw 15px;
    background-size: 60px;
} 
section .cta h3{
    text-align: center;
}
.footer {
    padding-top: 0;
    padding-bottom: 0;
}
#pagetop {
    font-size: 10px;
    width: 15vw;
    border-radius: 15vw;
    height: 15vw;
    padding: 1.5em 0 0;
}
#pagetop a {
    line-height: 1.4;
}

/* 改行 */
p.desc br, .video_bg p br, .update.update_04 p br{
    display: none;
}
    
/* contact form */
.contact {
    padding: 6vw 0 12vw;
}
.contact p {
    font-size: 14px;
}
.contact h2 {
    font-size: 8vw;
}
.contact h3 {
    font-size: 6vw;
}
.form-horizontal .control-label {
    font-size: 1em;
}
.contact .desc p br, p.attention br {
    display: none;
}
.contact_page p.attention {
    margin-right: 0;
    font-size: .8em;
}
.contact label {
    padding-left: 0;
}
.sp_mb_1em {
    margin-bottom: 1em;
}
}
@media screen and (max-width: 320px) {

}