@charset "utf-8";

* {
	box-sizing: border-box;
}

/* -----------------------------------------------------------------
   reset
----------------------------------------------------------------- */

html {overflow-y: scroll;}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,th,td {margin: 0;padding: 0;box-sizing: border-box;}
img{border: 0;vertical-align:bottom;}
li {list-style-type: none;}
em,strong{font-style:normal;}


/* -----------------------------------------------------------------
   共通
----------------------------------------------------------------- */

a:link{
	color:#1B4F98;/* リンク文字色 */
}
a:visited{
	color:#1B4F98;
}
a:active{
	color:#1B4F98;
}
a:hover{
	color: #1B4F98;/* リンク文字色（hover時） */
}

body{
	margin:0;
	padding:0;
    background-color:#fff;/* body背景色 */
    background-image:url('');       /* body背景画像 */
    background-repeat:repeat;   /* body背景画像繰り返し */
    background-position:left top; /* body背景画像ポジション */
    color:#333;     /* body文字色 */
	text-align:center;
    font-size:13px; /* body文字サイズ */
    font-family:"Lucida Sans Unicode", "Lucida Grande", Arial, Helvetica, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", sans-serif;
    line-height:1.6;
}

label{
	cursor:pointer;
}

.btn,.btn:link,.btn:visited,.btn:active,.btn:hover{
	min-width: 250px;
	max-width: 290px;
	border: none;
	background: #333;
	color: #fff;
	text-decoration:  none;
	padding: 8px 32px;
	box-sizing: border-box;
	border-radius: 5px;
	font-size: 17px;
	display: inline-block;
	margin: 0 auto;
	cursor: pointer;
	vertical-align: middle;
	
}

.btn:hover{
	opacity: 0.8;
}

.wrap{
	width:700px;/* コンテンツの幅 */
	margin:20px auto 0;
}

.header {
	text-align: left;
	overflow: hidden;
	_zoom: 1;
}

.header a {
	text-decoration: none;
	color: #333;
}

.header p {
	margin: 10px;
	font-weight: bold;
	font-size: 22px;
}

.text-left {
	text-align: left;
}

.main{
	padding: 15px 30px;
	background: #fff;
	border-width: 1px;
	border-style: solid;
	border-color: #ddd;
}

.shoplink {
	text-align: right;
	margin-bottom: 10px;
}


.section{
	position: relative;
	overflow: hidden;
}

.entry {
	border-top-width: 1px;
	border-top-style: dotted;
	border-top-color: #ddd;
	padding-top: 40px;
	margin-top: 40px;
}

.shopBtnWrap{
	position: absolute;
	right: 0;
}

.headImg{
    width: 100%;
    margin-top: 72px;
}

.headImg img{
    max-width: 100%;
}


.alert {
  padding: 15px;
  margin-bottom: 15px;
  border: 1px solid transparent;
  border-radius: 4px;
}
.alert-warning {
  background-color: #fcf8e3;
  border-color: #faebcc;
  color: #8a6d3b;
}
.alert-danger {
  background-color: #f2dede;
  border-color: #ebccd1;
  color: #a94442;
}
.alert-success {
  background-color: #dff0d8;
  border-color: #d6e9c6;
  color: #3c763d;
}

.has-error,
input[type="text"].has-error,
input[type="password"].has-error,
select.has-error {
  border-color: #a94442;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
}

.has-error,
.has-error.radio+label,
.has-error.checkbox+label {
  color: #a94442;
}

.pageTitle{
    text-align: left;
	font-size:15px;    /* タイトルのフォントサイズ */
	color:#333;        /* タイトルの文字色 */
	margin: 15px auto;
}

.h2-Title{
    text-align: left;
    margin-bottom: 10px;
	font-size:15px;    /* タイトルのフォントサイズ */
	color:#333;        /* タイトルの文字色 */
}

.p-left{
	text-align: left;
	line-height: 1.6;
}

.login-center-border{
	border: solid 1px #ddd;
}

.loginform{
	width: 390px;
	margin: 20px auto 0;
}

.loginform th{
	text-align:left;
	min-width:120px;
	padding:5px 8px;
	background:#ccc; /* テーブルの背景色（タイトル） */
	font-size:13px; /* テーブルのフォントサイズ（タイトル） */
	color:#333;/* テーブルの文字色（タイトル） */
}
.loginform td{
	text-align:left;
	padding:5px;
	background:#eee; /* テーブルの背景色（項目） */
}
.loginform td input{
	width:200px;
	font-size:13px; /* テーブルのフォントサイズ（項目） */
    color:#333; /* テーブルの文字色（項目） */
}

.passwordtxt{
	width: 390px;
	text-align: left;
	margin: 4px auto 0;
}

.btnWrap{
	margin-top: 20px;
}

.keeptxt{
	width: 390px;
	margin: 4px auto 15px;
}

.link{
	text-align: center;
	margin-top: 10px;
	margin-bottom: 40px;
}

.codeBtnWrap{
	margin-top: 20px;
	position: relative;
}

.login-btn {
	z-index: 1;
}

.return-login {
	position: absolute;
	right: 0;
	top: 50%;
	z-index: 1;
}

@media screen and (max-width: 768px){

    .header img {
        max-width: 100%;
    }
    .wrap {
        width: 100%;
    }
    .main {
        padding: 1rem;
        border: none;
        float: left;
    }
    .headImg img{
        max-width: 100%;
    }
    .loginform, .password .loginform {
        width:100%;
    }
    .password input[name="email"] {
        width: 100%;
    }
    .loginform th {
        width: 100%;
        display: block;
    }
    .loginform td {
        width: 100%;
        display: block;
    }
    .loginform td input{
        width: 100%;
    }
    .keeptxt, .passwordtxt{
        width: 100%;
    }
    .seal{
        width: 100%;
    }
    .btn input[type="button"]{
        width: 100%;
        max-width: 400px;
    }
    .codeBtnWrap {
        text-align: left;
    }
    .codeBtnWrap button {
        width: 100%;
        min-width: 180px;
        max-width: 180px;
    }
    .codeBtnWrap button:hover {
        width: 100%;
        min-width: 180px;
        max-width: 180px;
    }
    .btnWrap button {
        width: 100%;
        max-width: 400px;
    }
}