﻿/*共通部分*/
* {
    padding: 0;
    margin: 0;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
}

body {
    font-family: 'ヒラギノ角ゴシック Pro', 'Hiragino Kaku Gothic Pro','游ゴシック Medium', 'Yu Gothic Medium', 'Yu Gothic', YuGothic, 游ゴシック体, メイリオ, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
    color: #444444;
    font-size: 12px;
    -webkit-text-size-adjust: 100%;
    font-weight: 300;
}

h1 {
    font-size: 36px;
    font-weight: bold;
    margin-top: 20px;
    color: #444444;
}

h2 {
    font-size: 20px;
    font-weight: bold;
}

h3 {
    font-size: 36px;
    font-weight: bold;
    margin-top: 20px;
    color: #444444;
}

h4 {
    font-size: 24px;
    color: #444444;
    margin-top: 20px;
    font-weight: bold;
}

.Base {
    width: 1050px;
    margin-left: auto;
    margin-right: auto;
}

.clear {
    clear: both;
}

input[type="submit"],
input[type="button"] {
    border-radius: 0;
    -webkit-box-sizing: content-box;
    -webkit-appearance: button;
    appearance: button;
    /*
    border: none;
    */
    box-sizing: border-box;
    cursor: pointer;
}

    input[type="submit"]::-webkit-search-decoration,
    input[type="button"]::-webkit-search-decoration {
        display: none;
    }

    input[type="submit"]::focus,
    input[type="button"]::focus {
        outline-offset: -2px;
    }


/*非表示にする場合*/
.hide {
    display: none;
}

select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

a {
    outline: 0;
}

    a:link {
        color: #444444;
        text-decoration: none;
    }

    a:visited {
        color: #444444;
        text-decoration: none;
    }

    a:hover {
        color: #888888;
        text-decoration: underline;
    }

input[type="submit"]:hover {
    opacity: 0.5;
    cursor: pointer;
}

input[type="button"]:hover {
    opacity: 0.5;
    cursor: pointer;
}


.blinking {
    -webkit-animation: blink 1.0s ease-in-out infinite alternate;
    -moz-animation: blink 1.0s ease-in-out infinite alternate;
    animation: blink 1.0s ease-in-out infinite alternate;
}

@-webkit-keyframes blink {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@-moz-keyframes blink {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes blink {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

.hisu {
    padding: 3px 4px;
    color: #FFFFFF;
    background-color: #FF0000;
    margin: 0 3px;
    font-style: normal;
}

.nini {
    padding: 3px 4px;
    color: #FFFFFF;
    background-color: #4DA6FF;
    margin: 0 3px;
    font-style: normal;
}

.MSGERR_RED {
    background-color: #FF0000;
    font-weight: bold;
    font-size: 15px;
    color: #FFFFFF;
    text-align: center;
    /*
    height: 37px;
    line-height: 37px;
        */
    display: block;
}

.MSGERR {
    font-size: 14px;
    color: Red;
    text-align: left;
    font-weight: bold;
    padding: 3px 0;
}

.MSGSTD {
    font-size: large;
    color: Blue;
    text-align: left;
}

.MSGSMALL {
    color: #007BFF;
    text-align: left;
}


/*font*/
.fB {
    font-weight: bold;
}

.fI {
    font-style: italic;
}

.fU {
    text-decoration: underline;
    text-decoration-color: #333333;
}

.f10 {
    font-size: 5px;
}

.f11 {
    font-size: 6px;
}

.f12 {
    font-size: 6px;
}

.f13 {
    font-size: 7px;
}

.f14 {
    font-size: 7px;
}

.f15 {
    font-size: 8px;
}

.f16 {
    font-size: 8px;
}

.f17 {
    font-size: 9px;
}

.f18 {
    font-size: 9px;
}

.f19 {
    font-size: 10px;
}

.f20 {
    font-size: 10px;
}

.f21 {
    font-size: 11px;
}

.f22 {
    font-size: 11px;
}

.f23 {
    font-size: 12px;
}

.f24 {
    font-size: 12px;
}

.f25 {
    font-size: 13px;
}

.f26 {
    font-size: 13px;
}

.f27 {
    font-size: 14px;
}

.f28 {
    font-size: 14px;
}

.f29 {
    font-size: 15px;
}

.f30 {
    font-size: 15px;
}

.f31 {
    font-size: 16px;
}

.f32 {
    font-size: 16px;
}

.f33 {
    font-size: 17px;
}

.f34 {
    font-size: 17px;
}

.f35 {
    font-size: 18px;
}

.f36 {
    font-size: 18px;
}

.f37 {
    font-size: 19px;
}

.f38 {
    font-size: 19px;
}

.f39 {
    font-size: 20px;
}

.f40 {
    font-size: 20px;
}

.f41 {
    font-size: 21px;
}

.f42 {
    font-size: 21px;
}

.f43 {
    font-size: 22px;
}

.f44 {
    font-size: 22px;
}



.cRed {
    color: #FF0000;
}

.cBlue {
    color: #0000FF;
}

.cOrange {
    color: #FF6600;
}

.cGreen {
    color: green;
}

.cShocd {
    color: #481C87;
}

.cTanka {
    color: #FF0000;
}


.cLblue {
    color: #00BFFF;
}

.cBrown {
    color: #410600;
}

.cDred {
    color: #C51920;
}


ol.list-none li {
    list-style: none outside none;
    padding-left: 1em;
    text-indent: -1.1em;
}

.btn-green {
    border-radius: 8px;
    -moz-border-radius: 8px;
    -webkit-border-radius: 8px;
    font-weight: bold;
    text-align: center;
    display: table-cell;
    -webkit-appearance: none;
}

.btn-green {
    color: #000000;
    background: -webkit-gradient(linear,center top,center bottom,from(#F5F5F5),color-stop(0.50,#E1E1E1),to(#999999));
    background: -moz-linear-gradient(top,#F5F5F5,#E1E1E1 50%,#999999);
    -moz-box-shadow: 1px 1px 4px #848484;
    -webkit-box-shadow: 1px 1px 4px #848484;
    border: solid 1px #666666;
    height: 40px;
    line-height: 40px;
    font-size: 18px;
    -webkit-appearance: none;
}


.btn-red, .btn-redS, .btn-redM {
    color: White;
    text-shadow: -1px -1px 2px #b00;
    padding: 3px 5px 3px 5px;
    border: 1px inset #d00;
    background-color: #e00;
    background: -moz-linear-gradient(#e00, #f00 35%, #d00);
    background: -webkit-gradient(linear,left top,left bottom,color-stop(0, #e00),color-stop(.35, #f00),color-stop(1, #d00));
    -webkit-box-shadow: 0px 5px 55px #888;
    -moz-box-shadow: 0px 5px 55px #888;
    box-shadow: 0px 5px 5px #888;
    border-radius: 4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    -webkit-appearance: none;
}

.btn-redS {
    width: 65px;
    height: 27px;
    font-size: 15px;
}

.btn-redM {
    width: 240px;
}

.btn-glayR, .btn-glayM, .btn-glayS, .btn-rglayM {
    font-size: 18px;
    color: #FFFFFF;
    background-color: #666666;
    font-weight: bold;
    width: 300px;
    height: 60px;
    cursor: pointer;
    border: none;
    -webkit-appearance: none;
    -webkit-border-radius: 0;
    border-radius: 0;
}

.btn-glayS {
    width: 65px;
    height: 27px;
}

.btn-glayM {
    width: 240px;
}

.btn-rglayM {
    color: #333333;
    background-color: #E6E6E6;
    border: solid 1px #999999;
}
.btn-orange {
    background-color: #FF7F00;
    background: -webkit-gradient(linear,center top,center bottom,from(#FF7F00),color-stop(0.35,#FF7F00),color-stop(0.70,#FF7F00),to(#FF7F00));
    background: -moz-linear-gradient(top,#FF7F00,#FF7F00 35%,#FF7F00 70%,#FF7F00);
    -moz-box-shadow: 1px 1px 4px #848484;
    -webkit-box-shadow: 1px 1px 4px #848484;
    border: solid 1px #333333;
    font-size: 18px;
    padding: 8px 0px;
    width: 220px;
    margin: 0 auto;
    display: block;
    -webkit-appearance: none;
}

.btn-orange2 {
    background-color: #DDDDDD;
    background: -webkit-gradient(linear,center top,center bottom,from(#DDDDDD),color-stop(0.35,#DDDDDD),to(#DDDDDD));
    background: -moz-linear-gradient(top,#DDDDDD,#DDDDDD 35%,#DDDDDD);
    -moz-box-shadow: 1px 1px 4px #848484;
    -webkit-box-shadow: 1px 1px 4px #848484;
    border: solid 1px #333333;
    font-size: 13px;
    padding: 2px;
    margin-left: 5px;
    border-radius: 2px;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    -webkit-appearance: none;
}

.btn-gray, .btn-delete {
    background-color: #DDDDDD;
    background: -webkit-gradient(linear,center top,center bottom,from(#DDDDDD),color-stop(0.35,#DDDDDD),to(#DDDDDD));
    background: -moz-linear-gradient(top,#DDDDDD,#DDDDDD 35%,#DDDDDD);
    border: solid 1px #333333;
    -moz-box-shadow: 1px 1px 4px #848484;
    -webkit-box-shadow: 1px 1px 4px #848484;
    padding: 8px 0;
    margin: 0 auto;
    display: block;
    width: 220px;
    font-size: 18px;
    -webkit-appearance: none;
    -webkit-border-radius: 0;
    border-radius: 0;
}

.btn-delete {
    padding: 3px 0;
    font-size: 14px;
    width: 68px;
    margin: 5px 5px;
    font-size: 15px;
    background-color: #666666;
    background: -webkit-gradient(linear,center top,center bottom,from(#666666),color-stop(0.35,#666666),to(#666666));
    background: -moz-linear-gradient(top,#666666,#666666 35%,#666666);
    -webkit-appearance: none;
    -webkit-border-radius: 0;
    border-radius: 0;
}

.btn-gray500 {
    color: #ffffff;
    background-color: #666666;
    border: solid 1px #666666;
    display: block;
    width: 250px;
    height: 40px;
    font-size: 19px;
    -webkit-appearance: none;
    -webkit-border-radius: 0;
    border-radius: 0;
}

.btn-gray440 {
    color: #ffffff;
    background-color: #666666;
    border: solid 1px #666666;
    width: 220px;
    height: 40px;
    font-size: 18px;
    font-weight: bold;
    -webkit-appearance: none;
    -webkit-border-radius: 0;
    border-radius: 0;
}

.btn-gray400 {
    color: #ffffff;
    background-color: #666666;
    border: solid 1px #666666;
    width: 200px;
    height: 35px;
    font-size: 15px;
    -webkit-appearance: none;
    -webkit-border-radius: 0;
    border-radius: 0;
}

.btn-gray290 {
    color: #ffffff;
    background-color: #666666;
    border: solid 1px #666666;
    width: 145px;
    height: 35px;
    font-size: 15px;
    -webkit-appearance: none;
    -webkit-border-radius: 0;
    border-radius: 0;
}

.btn-gray240 {
    color: #ffffff;
    background-color: #666666;
    border: solid 1px #666666;
    width: 120px;
    height: 30px;
    font-size: 15px;
    -webkit-appearance: none;
    -webkit-border-radius: 0;
    border-radius: 0;
}

.btn-gray110 {
    color: #ffffff;
    background-color: #666666;
    border: solid 1px #666666;
    width: 55px;
    height: 14px;
    font-size: 10px;
    -webkit-appearance: none;
    -webkit-border-radius: 0;
    border-radius: 0;
}

.btn-gray120 {
    color: #ffffff;
    background-color: #666666;
    border: solid 1px #666666;
    width: 80px;
    height: 20px;
    font-size: 12px; /*24pt*/
    -webkit-appearance: none;
    -webkit-border-radius: 0;
    border-radius: 0;
}


.btn-darkgray440 {
    color: #ffffff;
    background-color: #444444;
    border: solid 1px #444444;
    width: 220px;
    height: 40px;
    font-size: 18px;
    font-weight: bold;
    -webkit-appearance: none;
    -webkit-border-radius: 0;
    border-radius: 0;
}

.btn-Lightgray100 {
    color: #333333;
    background-color: #CCCCCC;
    border: solid 1px #CCCCCC;
    width: 60px;
    height: 22px;
    line-height: 22px;
    font-size: 15px;
    -webkit-appearance: none;
    -webkit-border-radius: 0;
    border-radius: 0;
}

.btn-red500 {
    color: #ffffff;
    background-color: #B20000;
    border: solid 1px #B20000;
    display: block;
    width: 250px;
    height: 35px;
    font-size: 19px;
    -webkit-appearance: none;
    -webkit-border-radius: 0;
    border-radius: 0;
}

.btn-red400 {
    color: #ffffff;
    background-color: #B20000;
    border: solid 1px #B20000;
    width: 200px;
    height: 35px;
    font-size: 15px;
    -webkit-appearance: none;
    -webkit-border-radius: 0;
    border-radius: 0;
}

.btn-red290 {
    color: #ffffff;
    background-color: #B20000;
    border: solid 1px #B20000;
    width: 145px;
    height: 35px;
    font-size: 15px;
    -webkit-appearance: none;
    -webkit-border-radius: 0;
    border-radius: 0;
}


.btn-red240 {
    color: #ffffff;
    background-color: #B20000;
    border: solid 1px #B20000;
    width: 120px;
    height: 30px;
    font-size: 15px;
    -webkit-appearance: none;
    -webkit-border-radius: 0;
    border-radius: 0;
}

.btn-red178 {
    color: #ffffff;
    background-color: #B20000;
    border: solid 1px #B20000;
    width: 89px;
    height: 37px;
    font-size: 15px; /*30px*/
    -webkit-appearance: none;
    -webkit-border-radius: 0;
    border-radius: 0;
}

.btn-white240 {
    color: #333333;
    background-color: #FFFFFF;
    border: solid 1px #333333;
    width: 120px;
    height: 30px;
    font-size: 15px;
    font-weight: bold;
    -webkit-appearance: none;
    -webkit-border-radius: 0;
    border-radius: 0;
}


.MsgBtnLogin {
    width: 180px;
    height: 30px;
    background-color: #666666;
    border: solid 1px #666666;
    color: #FFFFFF;
    font-size: 18px;
    font-weight: bold;
    text-align: center;
    margin-right: 20px;
    -webkit-appearance: none;
    -webkit-border-radius: 0;
    border-radius: 0;
}

.MsgBtnAddUser {
    width: 180px;
    height: 30px;
    background-color: #B20000;
    border: solid 1px #B20000;
    color: #FFFFFF;
    font-size: 18px;
    font-weight: bold;
    text-align: center;
    -webkit-appearance: none;
    -webkit-border-radius: 0;
    border-radius: 0;
}

.BtnToCart {
    width: 200px; /*400*/
    height: 35px; /*70*/
    line-height: 35px;
    background-color: #FFFFFF;
    border: solid 1px #000000;
    color: #333333;
    font-size: 15px;
    text-align: center;
    vertical-align: middle;
    -webkit-appearance: none;
    -webkit-border-radius: 0;
    border-radius: 0;
}
.BtnToCartYoyaku {
    width: 200px; /*400*/
    height: 35px; /*70*/
    line-height: 35px;
    background-color: #5298D3;
    border: solid 1px #5298D3;
    color: #FFFFFF;
    font-size: 15px;
    text-align: center;
    vertical-align: middle;
    -webkit-appearance: none;
    -webkit-border-radius: 0;
    border-radius: 0;
}

.BtnFavorite {
    width: 200px; /*400*/
    height: 35px; /*70*/
    line-height: 35px;
    background-color: #666666;
    border: solid 1px #666666;
    color: #FFFFFF;
    font-size: 15px;
    text-align: center;
    vertical-align: middle;
    -webkit-appearance: none;
    -webkit-border-radius: 0;
    border-radius: 0;
}

.BtnFavoriteDel {
    width: 200px; /*400*/
    height: 35px; /*70*/
    line-height: 35px;
    background-color: #666666;
    border: solid 1px #666666;
    color: #FFFFFF;
    font-size: 15px;
    text-align: center;
    vertical-align: middle;
    -webkit-appearance: none;
    -webkit-border-radius: 0;
    border-radius: 0;
}

.btn-soldout {
    color: #FF0000;
    border: solid 2px #FF0000;
    font-size: 16px;
    font-weight: bold;
    padding: 8px 0;
    margin: 0 auto;
    width: 200px;
    display: block;
    text-align: center;
    -webkit-appearance: none;
    -webkit-border-radius: 0;
    border-radius: 0;
}

.btn-soldout-min {
    color: #FF0000;
    border: solid 1px #FF0000;
    font-size: 15px; /*30px*/
    width: 82px;
    height: 20px;
    line-height: 20px;
    text-align: center;
    -webkit-appearance: none;
    -webkit-border-radius: 0;
    border-radius: 0;
}

/*行タイトル*/
.FillTitle {
    height: 35px;
    line-height: 38px;
    width: 100%;
    font-size: 20px; /*40px*/
    font-weight: normal;
    color: #000000;
    margin-bottom: 10px;
    text-align: center;
}

/*行タイトル2*/
.FillTitle2 {
    height: 50px;
    line-height: 1em;
    width: 100%;
    font-size: 20px; /*40px*/
    font-weight: normal;
    color: #000000;
    text-align: center;
    word-break: break-all;
}

/*明細タイトル*/
.FillDetailTitle {
    height: 26px;
    line-height: 26px;
    width: 100%;
    font-size: 17px;
    background-color: #EEEEEE;
    color: #444444;
    vertical-align: middle;
}

/*行タイトル*/
.FillTitleAdd {
    width: 100%;
    font-size: 20px; /*40px*/
    font-weight: normal;
    color: #000000;
    margin-bottom: 10px;
    text-align: center;
}

/*行タイトル*/
.FillTitleAddSub {
    font-size: 14px; /*40px*/
}

.CmnTitleOrange {
    font-weight: bold;
    background-color: #DDDDDD;
    /*background-image: -webkit-gradient(linear, 0 0, 100% 100%,color-stop(.40, transparent), color-stop(.40, #FFFFFF),color-stop(.50, #FFFFFF), color-stop(.50, transparent),color-stop(.90, transparent), color-stop(.90, #FFFFFF),to(#FFFFFF));*/
    -webkit-background-size: 5px 5px;
    border-bottom: solid 1px #333333;
    border-top: solid 1px #333333;
    padding: 8px 5px;
    font-size: 18px;
}

.CmnTitleGray {
    background-color: #CCCCCC;
    -webkit-background-size: 5px 5px;
    padding: 8px 3px 8px 5px;
    font-size: 15px;
    border-top: solid 1px #666666;
    border-bottom: solid 1px #666666;
    font-weight: bold;
}

.required:before {
    content: "＊";
    color: #F00;
}

.pageLink {
    padding-top: 50px;
}
