@charset 'UTF-8';

/* **********************************************************************
 *
 *       Title:   FANZO login master.css
 *       Notes:   Hand-crafted by WebLab Corporation in Tokyo.
 *
 ********************************************************************** */


/* IE逕ｨ蜊ｰ蛻ｷ險ｭ螳咾SS
======================================================= */

@media print {
    body {
        _zoom: 67%; /*WinIE only */
    }
}


/* 蝓ｺ譛ｬ險ｭ螳�
======================================================= */

* {
    margin: 0;
    padding: 0;
}
html,body { height:100%; }
html { font-size: 62.5%; }

body {
  font: 1.0rem 'メイリオ', 'Meiryo', 'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ Pro W3', 'ＭＳ Ｐゴシック', 'Helvetica', 'Arial', 'Verdana', 'sans-serif';
    line-height: 1.6;
    min-width: 500px;
    text-align: left;
    color: #333;
    background: #ececec;
    font-family: "メイリオ",Meiryo,"游ゴシック",YuGothic,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","ＭＳ Ｐゴシック","MS PGothic",sans-serif;
	position: relative;
}

* html body {
    font: x-small;
}
:first-child + html body {
    font-size: small;
}

a:link,
a:visited {
    text-decoration: underline;
    color: #333;
}
a:hover,
a:active {
    text-decoration: none;
    color: #333;
}

address,
caption,
cite,
code,
dfn,
em,
th,
var {
    font-weight: normal;
    font-style: normal;
}

p {
    font-size: 13px;
    font-size: 1.3rem;
}

ul {
    font-size: 13px;
    font-size: 1.3rem;
    margin: 5px 0 5px 10px;
    padding: 0 0 0 10px;
}

ol {
    font-size: 13px;
    font-size: 1.3rem;
    margin: 5px 0 5px 15px;
    padding: 0 0 0 20px;
}

img {
    vertical-align: bottom;
}


/* 蜈ｱ騾夊ｨｭ螳�
======================================================= */

.error {
    background: #e16a60;
    padding: 8px 10px 6px 10px;
    color: #fff;
    margin: 0 0 20px;
}

.success {
    background: #51b291;
    padding: 8px 10px 6px 10px;
    color: #fff;
    margin: 0 0 20px;
}
.error p,
.success p {
    font-weight: bold;
    font-size: 14px;
    font-size: 1.4rem;
}



/* 繝壹�繧ｸ險ｭ螳�
======================================================= */

#login .wrapper {
    padding: 20px 0 0;
}
#login .main {
    padding: 0 0 70px;
}
#login .catch {
    text-align: center;
    margin: 0 0 20px;
}
#login .catch span {
    color: #c1574c;
    font-size: 16px;
    font-size: 1.6rem;
}
#login h1 {
    text-align: center;
    display: block;
    width: 187px;
    height: 230px;
    background: url(../img/logo.png) 0 0 no-repeat;
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
    margin: 0 auto 20px;
}
.loginbox {
    width: 360px;
    background: #fff;
    padding: 20px;
    margin: 0 auto;
}

/* 繝��繝ｫ驕ｸ謚� */
.toolselect {
    list-style-type: none;
    margin: 0;
    padding: 0;
    text-align: center;
    font-size: 14px;
    font-size: 1.4rem;
}
.toolselect input[type="radio"] {
    display:none; 
}

.toolselect li {
    display: inline-block;
    margin: 0 5px;
}
.toolselect label,
.toolselect a#tool01,
.toolselect a#tool02,
.toolselect a#tool03 {
    display:inline-block;
    width: 60px;
    color:#fff;
    padding:5px 10px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    cursor: pointer;
}
.toolselect #tool01 + label {
    background: #c1574c;
    box-shadow:0px 0px 0px 5px #fff;
}
.toolselect #tool02 + label {
    background: #7fa44b;
    box-shadow:0px 0px 0px 5px #fff;
}
.toolselect #tool03 + label {
    background: #448dae;
    box-shadow:0px 0px 0px 5px #fff;
}
.toolselect a#tool01{
    text-decoration: none;
    background: #c1574c;
    box-shadow:0px 0px 0px 5px #fff;
}
.toolselect a#tool02{
    text-decoration: none;
    background: #7fa44b;
    box-shadow:0px 0px 0px 5px #fff;
}
.toolselect a#tool03{
    text-decoration: none;
    background: #448dae;
    box-shadow:0px 0px 0px 5px #fff;
}

.loginarea {
    margin: 20px 0 0;
}

.toolselect input#tool01[type="radio"]:checked + label { 
    background-color:#c1574c;
    box-shadow:0px 0px 0px 5px #eaa7a0;
}
.toolselect input#tool02[type="radio"]:checked + label { 
    background-color:#7fa44b;
    box-shadow:0px 0px 0px 5px #c7e1a2;
}
.toolselect input#tool03[type="radio"]:checked + label { 
    background-color:#448dae;
    box-shadow:0px 0px 0px 5px #9ec6d8;
}

.loginbox input.hostname {
    width: 50%;
}

.loginbox .remind {
    font-size: 11px;
    font-size: 1.1rem;
    background: url(../img/arw_b.png) 0 .4em no-repeat;
    padding: 0 0 0 10px;
}

.loginbox .remind a,
.loginbox .remind a:visited {
    color: #666;
    text-decoration: none;
}
.loginbox .remind a:hover {
    text-decoration: underline;
}

input.loginbtn {
	border: none;
	background: #3d424a;
	color: #fff;
	padding: 10px 80px;
	font-size: 14px;
	font-size: 1.4rem;
	-webkit-border-radius: 30px;
	-moz-border-radius: 30px;
	border-radius: 30px;
}


/* 蛻�崛繧ｹ繧､繝�メ險ｭ螳�
======================================================= */

.dvc_switch {
    width: 100%;
    margin: 0 auto;
    text-align: center;
}
.dvc_switch ul {
    width: 90%;
    margin: 0 auto;
    padding: 0;
}
.dvc_switch li {
    float: left;
    width: 100%;
    list-style-type: none;
}
.dvc_switch li a#btnSP {
    display: inline-block;
    padding: 10px 10px 10px 35px;
    text-decoration: none;
    color: #fff;
    background: url(../img/sp/ico_pc.png) 10px 50% no-repeat;
    -webkit-background-size: 17px 16px;
       -moz-background-size: 17px 16px;
         -o-background-size: 17px 16px;
            background-size: 17px 16px;
        -ms-background-size: 17px 16px;
}
.dvc_switch li a#btnPC {
    display: none;
}
.dvc_switch p {
    font-size: 77%;
    width: 100%;
    margin: 0 auto;
    padding: 0 0 10px;
    text-align: center;
    color: #fff;
}


/* 豎守畑繧ｹ繧ｿ繧､繝ｫ險ｭ螳�
======================================================= */

.float_l{ float: left; }
.float_r{ float: right; }
.texts{ font-size: 77%; }

.vab { vertical-align: bottom; }
.vam { vertical-align: middle; }
.vat { vertical-align: top; }

.tac { text-align: center; }
.tal { text-align: left; }
.tar { text-align: right; }

.txt_red {
    color: #e54033;
}

.w100 { width: 100%; }
.w98 { width: 98%; }
.w95 { width: 95%; }
.w90 { width: 90%; }
.w80 { width: 80%; }
.w70 { width: 70%; }
.w60 { width: 60%; }
.w50 { width: 50%; }
.w40 { width: 40%; }
.w35 { width: 35%; }
.w30 { width: 30%; }
.w25 { width: 25%; }
.w15 { width: 15%; }

.full { width: 976px; }

.mb05 { margin-bottom: 5px; }
.mb10 { margin-bottom: 10px; }
.mb15 { margin-bottom: 15px; }
.mb20 { margin-bottom: 20px; }
.mb30 { margin-bottom: 30px; }
.mb40 { margin-bottom: 40px; }

.pc_none { display: none; }
.overimg { cursor: pointer; }
.clearfix {
    zoom: 1;
}
.clearfix:after {
    display: block;
    clear: both;
    content: '';
}
*:after {
    display: block;
    clear: both;
}