/*******************商品詳細*****************/
.item_detail_title{
    padding : 0.2em;
    font-size:1.6em;
    color:#FFFFFF;
    background-color:#6bc0f6;
    text-align:center;
}
.item_detail_box{
    clear:both;
    /*width:97%;*/
    padding:1em;
    border-left:1px #6bc0f6 solid;
    border-right:1px #6bc0f6 solid;
    border-bottom:1px #6bc0f6 solid;
}
.item_detail_box > div:first-child div{
    padding-left:0.5em;
    padding-bottom:0.1em;
    border-left:solid 7px #6bc0f6;
	margin-bottom:0.5em;
    font-size:1.6em;
    color:#6bc0f6;
    font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;

}
/**商品画像枠 **/
.item_detail_box > div:nth-child(2) > div:nth-child(1){
    float:left;
    width:50%;

}

/**商品情報枠 **/
.item_detail_box > div:nth-child(2) > div:nth-child(2){
    float:left;
    width:50%;
}

/**価格・オプション・数量・ボタン等 **/
.item_detail_box > div:nth-child(2) > div:nth-child(2) > div:nth-child(2){
    text-align:right;
}

.put_cart_btn{
    font-size:1.5em;
    padding:0.4em 1em 0.4em 1em;
    background-color:#ff7777;
}
/*******************関連商品ボックス*****************/
.item_kanren_box{
    width:100%;
    height:auto;
    border:1px #CCC solid;
}
.item_kanren_box > div:first-child{
    padding : 0.2em;
    font-size:1.6em;
    color:#FFFFFF;
    background-color:#CCCCCC;
    text-align:center;

}
.item_kanren_box > div:nth-child(2) > div:not(.clear){
    text-align:center;
    float:left;
    margin:0.5em;
    width:31.2%;

}
/*******************商品説明ボックス*****************/
.item_explain_box{
    border:1px #CCC solid;
    padding:0.5em;
}
.item_explain_box > div:not(.clear) {
    float:left;
    width:50%;
}
/*******************商品リスト*****************/
.cate_list_column{
    clear:both;
    width:100%;
    height:auto;

}
.cate_list_column > div:nth-child(1){
    width:25%;
    float:left;
}
.cate_list_column > div:nth-child(2){
    width:75%;
    float:left;
}
/************マイページ注文履歴一覧***************/
.order_rireki_list{
    width:100%;
    border:1px #CBCBCB solid;
    padding:8px;
}
/*注文番号、注文日時の全体枠*/
.order_rireki_list > div:nth-child(1){
    background-color:#EDF4F8;
    padding:8px;
}
/*注文番号、注文日時*/
.order_rireki_list > div:nth-child(1) > div:nth-child(odd):not(.clear){
    clear:both;
    float: left;
    padding-right:10px;
}
/*注文番号、注文日時の値*/
.order_rireki_list > div:nth-child(1) > div:nth-child(even){
    float: left;
}

/*商品詳細全体*/
.order_rireki_list > div:nth-child(2){
    padding:8px;
}
/*商品詳細の明細全体枠*/
.order_rireki_list > div:nth-child(2) > div:nth-child(2){
    /*border:1px red solid;*/
}
/*商品詳細の商品名、オプションの全体枠*/
.order_rireki_list > div:nth-child(2) > div:nth-child(2) > div:nth-child(odd){
    /*border:1px red solid;*/
    padding:8px 8px 8px 32px;
}

/*商品詳細の単価、数量、税込、ポイントの全体枠*/
.order_rireki_list > div:nth-child(2) > div:nth-child(2) > div:nth-child(even){
    /*border:1px red solid;*/
    padding:8px;
    float:right;

}
/*商品詳細の単価、数量、税込、ポイント*/
.order_rireki_list > div:nth-child(2) > div:nth-child(2) > div:nth-child(even) > div:nth-child(odd):not(.clear){
    clear:both;
    float:left;
    min-width:100px;
    padding-right:10px;

    /*border:1px red solid;*/
}
/*商品詳細の単価、数量、税込、ポイントの値枠*/
.order_rireki_list > div:nth-child(2) > div:nth-child(2) > div:nth-child(even) > div:nth-child(even):not(.clear){
    float:left;
    min-width:100px;
    text-align:right;
    /*border:1px blue solid;*/
}

/*商品詳細の小計、送料、合計、獲得ポイントの全体枠*/
.order_rireki_list > div:nth-child(2) > div:nth-child(3){

    float:right;
}
/*商品詳細の小計、送料、合計、獲得ポイントの項目名枠*/
.order_rireki_list > div:nth-child(2) > div:nth-child(3) > div:nth-child(odd):not(.clear){
    clear:both;
    float:left;
    min-width:100px;
    padding-right:10px;
}
/*商品詳細の小計、送料、合計、獲得ポイントの値枠*/
.order_rireki_list > div:nth-child(2) > div:nth-child(3) > div:nth-child(even):not(.clear){
    float:left;
    min-width:100px;
    text-align:right;
}
/*支払い方法・発送情報の全体枠*/
.order_rireki_list > div:nth-child(3){
    padding:8px;
}
/*支払い方法、受付け状態、発送日、到着予定日、発送業者、伝票番号などの全体枠*/
.order_rireki_list > div:nth-child(3) > div:nth-child(2){
    padding:8px 8px 8px 32px;
}
/*支払い方法、受付け状態、発送日、到着予定日、発送業者、伝票番号などの項目名*/
.order_rireki_list > div:nth-child(3) > div:nth-child(2) > div:nth-child(odd):not(.clear){
    clear:both;
    float:left;
    min-width:100px;
    padding-right:10px;
    text-align:left;
   /*border:1px #CCC solid;*/
}
.order_rireki_list > div:nth-child(3) > div:nth-child(2) > div:nth-child(even):not(.clear){
    float:left;
    min-width:100px;
    text-align:left;
}
/*注文詳細を表示する全体枠*/
.order_rireki_list > div:nth-child(4){
    background-color:#EDF4F8;
    padding:8px;
}
/*注文詳細を表示する枠*/
.order_rireki_list > div:nth-child(4) > div{
    font-size:16px;
    text-align:center;
}
/************ ポイント通帳 ***************/
.sum_get_point_box{
    max-width:768px;
    margin:0 auto;
    /*border:1px #CBCBCB solid;*/
    padding:8px;
}
.sum_get_point_box > div:not(.clear){
    width:250px;
    padding:8px;
    float:left;
    border:1px #CCCCCC solid;
}
.sum_get_point_box > div > div:nth-child(1){
    border-bottom:1px #CCCCCC solid;
    padding:8px;
}
.sum_get_point_box > div > div:nth-child(2){
    padding:8px;
}

.point_meisai_box{
    width:100%;
    border:1px #CBCBCB solid;
    padding:8px;
}
.point_meisai_box > div:nth-child(1){
    padding:8px;
    border-bottom:1px #CCC solid;
    background-color:#90cafa;
}
.point_meisai_box > div:nth-child(1) > div:nth-child(odd):not(.clear){
    clear:both;
    float:left;
    width:120px;
}
.point_meisai_box > div:nth-child(1) > div:nth-child(even):div:not(.clear){
    float:left;
}
.point_meisai_box > div:nth-child(2){
    padding:8px;
    border-bottom:1px #CCCCCC solid;
}
.point_meisai_box > div:nth-child(2) > div:nth-child(2){
    padding-left:16px;
}

.point_meisai_box > div:nth-child(3){
    padding:8px;

}
.point_meisai_box > div:nth-child(3) > div:not(.clear){
    float:right;
}

.point_meisai_box > div:nth-child(3) > div:not(.clear) > div:nth-child(odd):not(.clear){
    clear:both;
    float:left;
    width:120px;
}
.point_meisai_box > div:nth-child(3) > div:not(.clear) > div:nth-child(even):not(.clear){
    float:left;
}
/***********************************共通部品*******************************************/

.button1{
    cursor:pointer;
    font-size:1.6em;
    border-style:none;
    text-align:center;
    padding:0.4em 4em 0.4em 4em;
    color:#FFFFFF;
    background-color:#FF7777;
}
.button2{
    cursor:pointer;
    font-size:1.2em;
    border-style:none;
    text-align:center;
    padding:0.4em 2em 0.4em 2em;
    color:#FFFFFF;
    background-color:#0565af;
}
.button3{
    cursor:pointer;
    font-size:1.2em;
    border-style:none;
    text-align:center;
    padding:0.4em 0.7em 0.4em 0.7em;
    color:#FFFFFF;
    background-color:#575748;
}
/*****フォーム関係****/
.form_box1{
    width:100%;
    padding:2px;
}
.form_box1 > div{
    height:45px;
}
/*すべての列*/
.form_box1 > div > div:not(.clear){
    float:left;
    font-size:13px;
    padding:5px;
    height:100%;
    border:1px #CCC solid;
}
/**1列目**/
.form_box1 > div > div:nth-of-type(1){
    width:30%;
    font-weight:bold;
    background-color:#EDF4F8;
}
/**2列目**/
.form_box1 > div > div:nth-of-type(2){
    width:70%;
}
.form_box2{
    width:100%;
    height:133px;
    padding:2px;
    font-weight:normal;
    border:1px #CCC solid;
}
/**1列目**/
.form_box2 > div:nth-of-type(1){
    float:left;
    width:65%;
    height:100%;
    /*background-color:red;*/
    /*border-bottom:1px #dfdfdf solid;*/
}

.form_box2 > div:nth-of-type(1) > div:not(.clear){
    float:left;
    padding:2px;
}
.form_box2 > div:nth-of-type(1) > div:nth-of-type(2) > div > div:not(.clear){
    float:left;
}
/**2列目**/
.form_box2 > div:nth-of-type(2){
    width:35%;
    height:100%;
    float:left;
    /*background-color:gray;*/
}
.form_box2 > div:nth-of-type(2) > div{
    margin-right: 0;
    margin-left : auto;
    margin-top:10px;
    width:200px;
    /*background-color:yellow;*/
}
.form_box2 > div:nth-of-type(2) > div > div > div:not(.clear){
    float:left;
    padding:2px;
}

.res_table01{

}
.res_table01 {
    width: 100%;
    border:1px grey solid;

}
.res_table01 > tbody > tr > th {
    background-color: #f5f5f6;
}
.res_table01 > tbody > tr > th, .res_table01 > tbody > tr > td {
    display: block;
    text-align: left;
    font-size: 12px;
    padding: 1rem;
    border: solid 1px #e5e5e5; }
.calendar_table {
    width: 240px;
    margin: 1% 1% 1% 1%;
}
.calendar_table {
    background-color: #e0ded9;
    width: 210px;
}
.calendar_table .year th{
    padding:16px;
}

.calendar_table .day td{
    padding:8px;
    text-align:right;
}


/***************************************************************************************
 *
 * PC(99999px以下のディスプレイで見た場合のスタイル)
 * ※共通部分と分ける為に使用
 *
 * **************************************************************************************/
@media screen and (max-width:99999px) {
    /*******************商品詳細*****************/
    #main_content_box img{
        max-width:100%;
    }
    /**価格・オプション・数量・ボタン等 **/
    #main_content_box .item_detail_box > div:nth-child(2) > div:nth-child(2) > div:nth-child(2) > div:not(.clear){
        padding:0.2em;
    }

}
/************************************************************************************************
 *
 * タブレット(768px以下のディスプレイで見た場合のスタイル)
 *
 * **********************************************************************************************/
@media screen and (max-width:768px) {

    /*******************関連商品ボックス*****************/
    #main_content_box .item_kanren_box > div:nth-child(2) > div:not(.clear){
        width:47%;
    }
    /*******************商品説明ボックス*****************/
    #main_content_box .item_explain_box{
        width:98%;
        padding:0.2em;
    }
    #main_content_box .item_explain_box > div:not(.clear) {
        float:none;
        width:99%;
    }
    /**********************共通部品*************************/
    .button1{
        cursor:pointer;
        font-size:1.6em;
        border-style:none;
        text-align:center;
        padding:0.4em 2em 0.4em 2em;
        width:98%;
        color:#FFFFFF;
        background-color:#FF7777;
    }
    .form_box1 > div{
        height:auto;
    }
    .form_box1 > div > div:not(.clear){
        float:none;
        width:100%;
        height:auto;
        border:none;
    }
    .form_box2{
        width:100%;
        height:auto;
        padding:2px;
        font-weight:normal;
        border:1px #CCC solid;
    }
    .form_box2 > div:nth-of-type(1){
        float:none;
        width:100%;
        height:100%;
        border-bottom:1px #dfdfdf solid;
    }
    .form_box2 > div:nth-of-type(2){
        float:none;
        width:100%;
        height:100%;
    }
    /************ ポイント通帳 ***************/
    .sum_get_point_box{
        max-width:268px;
    }



}
/************************************************************************************************
 *
 * スマホ(480px以下のディスプレイで見た場合のスタイル)
 *
 * **********************************************************************************************/
@media screen and (max-width:480px) {
    /*******************商品詳細*****************/
    #main_content_box .item_detail_box > div:nth-child(2){
        text-align:center;
    }
    #main_content_box .item_detail_box > div:nth-child(2) > div:nth-child(1){
        float:none;
        width:100%;
    }
    #main_content_box .item_detail_box > div:nth-child(2) > div:nth-child(2){
        float:none;
        width:100%;
		text-align:left;
    }
    #main_content_box .item_detail_box > div:nth-child(2) > div:nth-child(2) > div:nth-child(2){

    }
     /*******************関連商品ボックス*****************/
    #main_content_box .item_kanren_box > div:nth-child(2) > div:not(.clear){
        width:98%;
    }
    /*******************商品リスト*****************/
    #main_content_box .cate_list_column{
        width:99%;
    }
    #main_content_box .cate_list_column > div:nth-child(1){
        width:99%;
        float:none;
    }
    #main_content_box .cate_list_column > div:nth-child(2){
        width:99%;
        float:none;
    }
    .form_box2 > div:nth-of-type(1) > div:nth-of-type(2) > div > div:not(.clear){
        float:none;
    }
    .form_box2 > div:nth-of-type(2) > div{
        margin-right: 0;
        margin-left : auto;
        margin-top:10px;
        width:170px;
    }

}
/************************************************************************************************
 *
 * スマホ(320px以下のディスプレイで見た場合のスタイル)
 *
 * **********************************************************************************************/
@media screen and (max-width:320px) {


}
