@charset "UTF-8" ;
/* *****************************************************************
	共通設定 start
****************************************************************** */

html{
    height:100%; /*ブラウザいっぱいに高さを取得*/
}
body{
     width: 100%;
     height:100%; /*ブラウザいっぱいに高さを取得*/
     margin:0;
     padding:0;
}
#logo{
    width:250px;
    height:50px;
    text-align:left;            /* 中身を左寄せに戻す */
    background-image: url(/public/images/logo.png);
    background-size: 250px 50px;
    margin-top: 30px;
}
@media screen and (max-width:650px)
{
    #logo{
        width:200px;
        height:40px;
        background-size: 200px 40px;
    }
}
@media screen and (max-width:550px)
{
        width:150px;
        height:30px;
        background-size: 150px 30px;
}
@media screen and (max-width:450px)
{
    #logo{
        width:300px;
        height:60px;
        background-size: 300px 60px;
        text-align:center;            /* 中身を左寄せに戻す */
    }
}

.contents{
        margin-left:auto;           /* IE以外用の中央寄せ */
        margin-right:auto;          /* IE以外用の中央寄せ */
        text-align:left;            /* 中身を左寄せに戻す */
        width:750px;                /* 幅 */
        color:#000000;              /* 文字色 */
}

#wrapper{
    width:100%;
    margin:0 auto;
    position: relative;/*フッターの位置設定の基準*/
    min-height: 100%;/*最低値を100％にしておけばコンテンツ量が増えた分だけ伸びる*/
    height: auto !important;/*ie6用*/
    height: 100%;   
    background-color: #ffffff;/*コンテンツの背景色は全体囲みのココに指定*/
}
    .main{
        width:750px;
    }

div#left_content
{
	display:none;
}
div#right_content
{	
        width:100%;                /* 幅 */
        color:#000000;              /* 文字色 */
        margin-left: 20px;
}

.clear{
    clear:both;
}
.start_required{
    font-weight: bold;
    color: red;
    
}
#error_message{
    font-weight: bold;
    color:red;
    margin-left:170px;
}
#basic_message{
    font-weight: bold;
    padding-bottom:10px;
}



th  {font-size: 200%;}
div.box_login {position: relative; top: 100px;left: 0px;}
.login_title {
    font-size: 150%;
    font-weight:bold;
    margin:20px 0px 20px 0px;
}
.contents_title {
    font-size: 120%;
    font-weight:bold;
    margin:20px 0px 20px 0px;
}

td {padding: 10px;}
th {padding: 10px;}

div, p, span, a, input, select, textarea, form, ul, ol, li, dl, dt, dd, tr, td, table {
	font-size:100%;
}

.view_item{
	width:820px;
        height:30px;
        margin-bottom:15px;
}

.view_item_pic {
	width:720px;
    height:200px;
    margin-bottom:10px;
}
.view_item_btn_area {
	width:750px;
	height :80px;
    text-align:center;
}
.view_title {
	float:left;
	width:200px;	
}
.view_control {
	float:left;	
	width:555px;
}
.view_item .view_control input {
	width:535px;
}
@media screen and (max-width:900px)
{
    .contents{
        margin-left:0;           /* IE以外用の中央寄せ */
        margin-right:0;          /* IE以外用の中央寄せ */
    }
    .main,.contents,#right_content,.view_item,.view_item_pic,.view_item_btn_area,.view_title,.view_control,.view_item {
            width:820px;
    }
    .view_item .view_control input{
            width:800px;
    }
    .main{
            margin-left:5px;
            padding-top:0px;
    }
    .view_item {
            height:60px;
    }
    .view_item_pic {
            height:300px;
    }
    .view_item_btn_area {
            height :100px;
    }
    .view_title {
            font-weight:bold;
            float:left;
            height:25px;
    }

    .main {
            height:80px;
    }
    #error_message{
        margin-left:0px;
    }
}
@media screen and (max-width:850px)
{
    .main,.contents,#right_content,.view_item,.view_item_pic,.view_item_btn_area,.view_title,.view_control,.view_item {
            width:770px;
    }
    .view_item .view_control input{
            width:750px;
    }
}
@media screen and (max-width:800px)
{
    .main,.contents,#right_content,.view_item,.view_item_pic,.view_item_btn_area,.view_title,.view_control,.view_item {
            width:720px;
    }
    .view_item .view_control input{
            width:700px;
    }
}
@media screen and (max-width:750px)
{
    .main,.contents,#right_content,.view_item,.view_item_pic,.view_item_btn_area,.view_title,.view_control,.view_item {
            width:670px;
    }
    .view_item .view_control input{
            width:650px;
    }
}
@media screen and (max-width:700px)
{
    .main,.contents,#right_content,.view_item,.view_item_pic,.view_item_btn_area,.view_title,.view_control,.view_item {
            width:620px;
    }
    .view_item .view_control input{
            width:600px;
    }
}
@media screen and (max-width:650px)
{
    .main,.contents,#right_content,.view_item,.view_item_pic,.view_item_btn_area,.view_title,.view_control,.view_item {
            width:570px;
    }
    .view_item .view_control input{
            width:550px;
    }
}
@media screen and (max-width:600px)
{
    .main,.contents,#right_content,.view_item,.view_item_pic,.view_item_btn_area,.view_title,.view_control,.view_item {
            width:520px;
    }
    .view_item .view_control input{
            width:500px;
    }
}
@media screen and (max-width:550px)
{
    .main,.contents,#right_content,.view_item,.view_item_pic,.view_item_btn_area,.view_title,.view_control,.view_item {
            width:470px;
    }
    .view_item .view_control input{
            width:450px;
    }
}
@media screen and (max-width:500px)
{
    .main,.contents,#right_content,.view_item,.view_item_pic,.view_item_btn_area,.view_title,.view_control,.view_item {
            width:420px;
    }
    .view_item .view_control input{
            width:400px;
    }
}
@media screen and (max-width:450px)
{
    .main,.contents,#right_content,.view_item,.view_item_pic,.view_item_btn_area,.view_title,.view_control,.view_item {
            width:370px;
    }
    .view_item .view_control input{
            width:350px;
    }
}
@media screen and (max-width:400px)
{
    .main,.contents,#right_content,.view_item,.view_item_pic,.view_item_btn_area,.view_title,.view_control,.view_item {
            width:320px;
    }
    .view_item .view_control input{
            width:300px;
    }
}
@media screen and (max-width:350px)
{
    .main,.contents,#right_content,.view_item,.view_item_pic,.view_item_btn_area,.view_title,.view_control,.view_item {
            width:270px;
    }
    .view_item .view_control input{
            width:250px;
    }
}
.view_title {
        font-weight:bold;
}

/* *****************************************************************
	ユーザ情報入力画面で使用する設定 end
****************************************************************** */