/*---
モバイル対応CSSは後段
---*/

@media screen and (min-width: 721px){

.loginbox::before{
    /*事前にボケ画像を読み込み*/
    width:440px;
    height:420px;
    /* background-image: url(jpg/rainbow_bokhe.jpg);/*ボケ画像*/
    
    /*角丸*/
    border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    
    opacity: 1;
    /* 画像側をボカシているのでblur設定は使わ無い */
    /* エッジを綺麗に切り抜く方法がうまくいかないからひとまず画像で対応 */
    /* filter: blur(10px); /*ボカシ具合を設定*/
    /* -webkit-filter: blur(10px); /*web-kitに対してボカシ具合を設定*/
    
    content: "";
    position: absolute;
    background-clip: content-box;
}

.loginbox{
    top:-50px;
    left:-220px;
    position: relative;
    margin: 0 auto;
    text-align:center;  
}

.text {
    color:#000000;
    top:50px;
    left:220px;
    width:440px;
    height:300px;
    z-index: 10;
    /*background:#00ff00;*/
    margin: 0 auto;
    text-align:center;
    position: relative;
}

.form {
    margin-top:20px;
}

div.input1.acountid {
    border-top-left-radius: 6px;
    border-top-right-radius: 6px;
    border-bottom-width: 0;
}
div.input1.acountid.focuson{
    border-bottom-width:1px;
}

.input1 {
    background-color: #ffffff;
    width:330px;
    height:46px;
    margin: 0 auto;
    border: 1px solid #D5D5D5;
}

div.input2 {
    border-bottom-left-radius: 6px;
    border-bottom-right-radius: 6px;
}

.input2 {
    background-color: #ffffff;
    width:330px;
    height:46px;
    margin: 0 auto;
    border: 1px solid #D5D5D5;
}

.inputm{
    padding-right: 0px;
    padding-left: 0;
}

.si-container {
    font-family: "Myriad Pro", "Helvetica Neue", Helvetica, Arial, Verdana, sans-serif;
    text-align: center;
    width: 100%;
    padding: 0;
}

.txt-input {
    height:40px;
    padding: 10px 12px;
    border:0px;
    margin:2px;
    font-size:18px;
    /*03.21追加*/
    border-radius:6px;
    width:98%;
    outline: 0px; /* テキストフィールド選択時に枠線を0pxにして消す */
    font-family: "Myriad Pro", "Helvetica Neue", Helvetica, Arial, Verdana, sans-serif;
}

}


/*---
以下、モバイルデバイスの時のCSS
---*/

@media screen and (max-width:720px){
.loginbox::before{
    /*事前にボケ画像を読み込み*/
    width:300px;
    height:360px;
    /* background-image: url(jpg/rainbow_bokhe.jpg);/*ボケ画像*/
    
    /*角丸*/
    border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    
    opacity: 1;
    /* 画像側をボカシているのでblur設定は使わ無い */
    /* エッジを綺麗に切り抜く方法がうまくいかないからひとまず画像で対応 */
    /* filter: blur(10px); /*ボカシ具合を設定*/
    /* -webkit-filter: blur(10px); /*web-kitに対してボカシ具合を設定*/
    
    content: "";
    position: absolute;
    background-clip: content-box;
}

.loginbox{
    top:-30px;
    left:-150px;
    position: relative;
    margin: 0 auto;
    text-align:center;  
}

.text {
    color:#000000;
    top:20px;
    left:150px;
    width:280px;
    height:300px;
    z-index: 10;
    /*background:#00ff00;*/
    margin: 0 auto;
    text-align:center;
    position: relative;
}

.form {
    margin-top:10px;
}

div.input1.acountid {
    border-top-left-radius: 6px;
    border-top-right-radius: 6px;
    border-bottom-width: 0;
}
div.input1.acountid.focuson{
    border-bottom-width:1px;
}

.input1 {
    background-color: #ffffff;
    width:280px;
    height:46px;
    margin: 0 auto;
    border: 1px solid #D5D5D5;
}

div.input2 {
    border-bottom-left-radius: 6px;
    border-bottom-right-radius: 6px;
}

.input2 {
    background-color: #ffffff;
    width:280px;
    height:46px;
    margin: 0 auto;
    border: 1px solid #D5D5D5;
}

.inputm{
    padding-right: 0px;
    padding-left: 0;
}

.si-container {
    font-family: "Myriad Pro", "Helvetica Neue", Helvetica, Arial, Verdana, sans-serif;
    text-align: center;
    width: 100%;
    padding: 0;
}

.txt-input {
    height:40px;
    padding: 10px 12px;
    border:0px;
    margin:2px;
    font-size:18px;
    /*03.21追加*/
    border-radius:6px;
    width:98%;
    outline: 0px; /* テキストフィールド選択時に枠線を0pxにして消す */
    font-family: "Myriad Pro", "Helvetica Neue", Helvetica, Arial, Verdana, sans-serif;
}

}