@charset "utf-8";

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,
form,fieldset,input,textarea,p,blockquote,th,td{
	padding:0;
	margin:0;
}
table{
	border-collapse: collapse;
	border-spacing:0;
}
fieldset,img{border:0;}
address,caption,cite,code,dfn,em,strong,th,var{
	font-weight:normal;
	font-style:normal;
}
ol,ul{list-style:none;}
caption,th{text-align:left;}
h1,h2,h3,h4,h5,h6{
	font-weight:normal;
	font-size:100%;
}

body {
    font-size: 62.5%; /* 10px */
    background-color: #929292;
    padding-top: 20px;
    padding-bottom: 20px;
}

.clearfix:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
    font-size:0.1em;
}
.clearfix {min-height: 1px;display:inline-table;}
/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display:block;}
/* End hide from IE-mac */
.clear {clear: both;}


/* 20151215 追加 */
.error_check {
width : 330px;
height : 60px;
color : red;
font-size : large;
font-weight : bold;
border-style : double;
border-color : black;
margin : 5px auto 5px auto;

background-color : white;
position : relative;
top : 30%;
padding-top : 10px;
padding-left : 10px;
}


a { color: #0071EE;    
    
}

#wrapper {
    width: 908px;
    margin-right: auto;
    margin-left: auto;
}

#header {
    background-image: url(/images/style/header_bg.png);
    background-repeat: no-repeat;
    background-position: center top;
    height: 83px;
    width: 874px;
    margin-right: auto;
    margin-left: auto;
    padding-top: 28px;
    padding-left: 34px;
}



#contents {
    background-image: url(/images/style/contents_bg.png);
    background-repeat: repeat-y;
    background-position: center top;
    padding-top: 35px;
}
#contents-bottom {
    background-image: url(/images/style/contents_bottom_bg.png);
    background-repeat: no-repeat;
    background-position: center top;
    height: 16px;
    width: 908px;
    margin-right: auto;
    margin-left: auto;
}
#main-contents {
    background-repeat: no-repeat;
    background-position: center top;
    margin-right: auto;
    margin-left: auto;
}
#hedding-group {
    padding-right: 10px;
    padding-left: 10px;
}

#hedding-group .hedding {
    height: 28px;
    width: 314px;
    margin-right: auto;
    margin-bottom: 1px;
    margin-left: auto;
    background-image: url(/images/style/contents_hedding_bg.png);
    background-repeat: no-repeat;
    background-position: center top;
    font-weight: bold;
    color: #FFF;
    text-align: center;
    padding-top: 15px;
    font-size: 1.6em;
}

#hedding-group .alert {
    height: 20px;
    width: 320px;
    margin-right: auto;
    margin-bottom: 1px;
    margin-left: auto;
    font-weight: bold;
    color: #FF0000;
    text-align: center;
    padding-top: 5px;
	padding-bottom: 20px;
    font-size: 1.2em;
}

#nav {
    text-align: center;
    margin-bottom: 20px;
}
#nav .next input {
    font-size: 1.4em;
    font-weight: bold;
    color: #FFF;
    background-image: url(/images/style/nav_next.png);
    background-color: transparent;
    text-align: center;
    display: block;
    padding: 0px;
    height: 56px;
    width: 314px;
    border-top-width: 0px;
    border-right-width: 0px;
    border-bottom-width: 0px;
    border-left-width: 0px;
    border-top-style: none;
    border-right-style: none;
    border-bottom-style: none;
    border-left-style: none;
    overflow: hidden;
    margin-right: auto;
    margin-left: auto;
    cursor: pointer;
}
#nav .next input:hover {
    position: relative;
    top: 1px;
    color: #CCC;
}
#nav .close input {
    font-size: 1.2em;
    color: #333;
    background-image: url(/images/style/nav_close.png);
    background-color: transparent;
    text-align: center;
    display: block;
    padding: 0px;
    height: 28px;
    width: 154px;
    border-top-width: 0px;
    border-right-width: 0px;
    border-bottom-width: 0px;
    border-left-width: 0px;
    border-top-style: none;
    border-right-style: none;
    border-bottom-style: none;
    border-left-style: none;
    overflow: hidden;
    margin-right: auto;
    margin-left: auto;
    cursor: pointer;
    background-color: transparent;
}
#nav .close input:hover {
    position: relative;
    top: 1px;
}

/* for index button */
#nav .next button {
    font-size: 1.4em;
    font-weight: bold;
    color: #FFF;
    background-image: url(/images/style/nav_next.png);
    background-color: transparent;
    text-align: center;
    display: block;
    padding: 0px;
    height: 56px;
    width: 314px;
    border-top-width: 0px;
    border-right-width: 0px;
    border-bottom-width: 0px;
    border-left-width: 0px;
    border-top-style: none;
    border-right-style: none;
    border-bottom-style: none;
    border-left-style: none;
    overflow: hidden;
    margin-right: auto;
    margin-left: auto;
    cursor: pointer;
}
#nav .next button:hover {
    position: relative;
    top: 1px;
    color: #CCC;
}

#copyright {
    font-size: 1.2em;
    text-align: center;
    padding-top: 25px;
    padding-bottom: 15px;
}

#ipadress-pos {
    text-align: center;
    font-size: 1.5em;
    font-weight: bold;
    margin-bottom: 10px; 
}

/* card01
--------------------------------------------------------- */
#card01 #main-contents {
    background-image: url(/images/style/card01_contents_bg.png);
	background-size: 100% 100%;
    height: auto;
    width: 800px;
    margin-bottom: 10px; /* 20170823 変更 40px to 10px */
}
#card01 .note {
    width: 800px;
    margin-right: auto;
    margin-left: auto;
    border-top-width: 1px;
    border-bottom-width: 1px;
    border-top-style: solid;
    border-bottom-style: solid;
    border-top-color: #424242;
    border-bottom-color: #424242;
    padding-top: 20px;
    padding-bottom: 10px;
}
#card01 .note li {
    width: 530px;
    margin-right: auto;
    margin-left: auto;
    font-size: 1.2em;
    color: #EF0000;
    margin-bottom: 10px;
}
#card01 .form {
    width: 610px;
    margin-right: auto;
    margin-left: auto;
}
#card01 .form th {
    font-size: 1.8em;
    font-weight: bold;
    width: 110px;
    vertical-align: top;
    padding-top: 8px;
}
#card01 .form td {
    font-size: 1.4em;
    padding-bottom: 25px;
    vertical-align: top;
}
#card01 .form td input {
    margin-bottom: 10px;
    width: 250px;
    padding: 5px;
}
#card01 .guide {
    font-size: 0.9em;
    color: #EF0000;
    font-weight: bold;
    text-align: left;
}
#card01 .service_name {
    font-size: 1.4em;
    color: #000000;
    font-weight: bold;
    padding-top: 8px;
}
#card01 .select_balance {
    font-size: 1.4em;
    color: #000000;
    font-weight: bold;
    margin-top: 8px;
	text-align: right;
}


#card01 #nav .next input { margin-bottom: 30px; }



/* card02
--------------------------------------------------------- */
#card02 #payment {
    width: 680px;
    margin-right: auto;
    margin-left: auto;
    margin-bottom: 25px;
}
#card02 #payment .service-title {
    width: 200px;
    border-bottom-width: 1px;
    border-bottom-style: solid;
    border-bottom-color: #424242;
    padding-bottom: 19px;
    float: left;
    font-size: 1.4em;
    position: relative;
    text-align: right;
    white-space: nowrap; /* 20170202追加 */
}
#card02 #payment .service-title span {
    margin-right: 20px;
    font-weight: bold;
    position: absolute;
    left: 0px;
    top: 0px;
}
#card02 #payment .service-name {
    width: 480px;
    border-bottom-width: 1px;
    border-bottom-style: solid;
    border-bottom-color: #424242;
    float: left;
    font-size: 1.4em;
    position: relative;
    text-align: left;
    bottom: 2px;
    white-space: nowrap;
}

#card02 #payment .price-title {
    width: 200px;
    border-bottom-width: 1px;
    border-bottom-style: solid;
    border-bottom-color: #424242;
    padding-bottom: 32px;
    float: left;
    font-size: 1.4em;
    position: relative;
    text-align: right;
    white-space: nowrap;
}
#card02 #payment .price-title span {
    margin-right: 20px;
    font-weight: bold;
    position: absolute;
    left: 0px;
    top: 13px;
}
#card02 #payment .price-value {
    width: 100px;
    border-bottom-width: 1px;
    border-bottom-style: solid;
    border-bottom-color: #424242;
    float: left;
    font-size: 1.5em;
    position: relative;
    text-align: right;
    padding-bottom: 32px;
}
#card02 #payment .price-value span {
    position: absolute;
    left: 0px;
    top: 10px;
    right: 15px;
}

#card02 #payment .price-button {
    font-size: 1.4em;
    position: relative;
    top: 5px;
}
#card02 #payment .price-button .nav-reset {
	height: 23px;
	width: 64px;
	color: #FFF;
	background-image: url(/images/style/nav_rekey.png);
	background-repeat: no-repeat;
	background-position: left top;
	background-color: transparent;
	display: block;
	position: absolute;
	right: 0px;
	top: -8px;
	font-size: 12px;
	text-align: center;
	text-decoration: none;
	z-index: 10;
	padding: 0px;
	border-top-width: 0px;
	border-right-width: 0px;
	border-bottom-width: 0px;
	border-left-width: 0px;
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
	overflow: hidden;
	cursor: pointer;
}
#card02 #payment .price .nav-reset:hover { top: -7px; }
#card02 #main-contents {
    background-image: url(/images/style/card02_contents_bg.png);
	background-size: 100% 100%;
    #height: 549px;
	height: auto;
    width: 800px;
    //margin-bottom: 40px;
    margin-bottom: 10px;
}
#card02 #hedding-group .hedding {
    margin-left: 0px;
    float: left;
    margin-right: 18px;
}
#card02 #hedding-group .form-info {
    font-size: 1.2em;
    color: #F30100;
    padding-top: 17px;
}

#card02 .form {
    width: 660px;
    margin-right: auto;
    margin-left: auto;
}
#card02 .form th {
    font-size: 1.4em;
    font-weight: bold;
    width: 165px;
    vertical-align: top;
    padding-top: 8px;
}
#card02 .form th span {
    font-size: 0.9em;
    font-weight: normal;
    color: #F30100;
}
#card02 .form td {
    font-size: 1.2em;
    padding-bottom: 20px;
    vertical-align: top;
}
#card02 .form td input {
    margin-bottom: 5px;
    width: 480px;
    padding: 5px;
}
#card02 .form td .group { margin-bottom: 5px; }
#card02 .form td .short { width: 300px; }
#card02 .form td .caution { color: #0058D4; }
#card02 .form td .guide {
    margin-bottom: 10px;
    line-height: 1.4em;
    padding-left: 14px;
    text-indent: -14px;
}
#card02 .form td .guide span { color: #F30100; }

#card02 #nav .next input { margin-bottom: 30px; }

/* card03
--------------------------------------------------------- */
#card03 #main-contents {
    background-image: url(/images/style/card03_contents_bg.png);
    height: 542px;
    width: 800px;
    margin-bottom: 25px;
}
#card03 #hedding-group .hedding { margin-bottom: 15px; 
}

#card03 #information {
    text-align: center;
    margin-bottom: 40px;
}
#card03 #information p {
    font-size: 1.6em;
    color: #C00;
    line-height: 1.4em;
}
#card03 #information .note { font-size: 1.2em; }
#card03 #information .contact {
    font-size: 1.2em;
    color: #333;
}
#card03 #check-list {
    margin-bottom: 30px;
    width: 700px;
    margin-right: auto;
    margin-left: auto;
}
#card03 #check-list li {
    margin-bottom: 15px;
}
#card03 #check-list li.last { margin-bottom: 0px; }
#card03 #check-list li p{
    font-size: 1.4em;
    line-height: 1.4em;
}
#card03 #check-list li p.guide{
    font-size: 1.2em;
    color: #C00;
    padding-left: 1.2em;
}
#card03 #check-list li p span { font-weight: bold; }

#card03 .caution {
    font-size: 1.2em;
    color: #C00;
    text-align: center;
    margin-bottom: 30px;
}

#card03 #company-info {
    width: 640px;
    margin-right: auto;
    margin-left: auto;
}
#card03 #company-info img {
    float: left;
    margin-right: 10px;
}
#card03 #company-info p {
    font-size: 1.2em;
    line-height: 1.6em;
    padding-top: 4px;
}

#card03 #nav .next input { margin-bottom: 10px; }
#card03 .pr {
    font-size: 1.4em;
    text-align: center;
}
