/* CSS Document */

/*----------------------------------------------------
    トップ
    URL：/
----------------------------------------------------*/
/* 商品一覧 */
.top_product {
    margin: 0 auto;
}
/* 基本レイアウト */
.top_2column {
    display: -webkit-flex;
    display: flex;
    flex-wrap: wrap;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin: 10px 0 0 0;
    padding: 10px;
}
.top_2column .wrap {
    width: 49%;
    padding: 10px 20px;
    border: 1px solid #222;
}
.top_2column h2 {
    color: #d4145a;
    font-size: 1.4em;
    margin: 0 0 10px 0;
}
/* お知らせ */
.top_2column .news .title {
    overflow: hidden;
}
.top_2column .news .title h3 {
    float: left;
}
.top_2column .news .title a.more {
    display: block;
    float: right;
    color: #d4145a;
}
.top_2column .news ul {
    margin: 0 0 10px 0;
}
.top_2column .news ul li {
    padding: 5px 0;
}
.top_2column .news ul li a {
    display: block;
    overflow: hidden;
    display: -webkit-flex;
    display: flex;
    flex-wrap: wrap;
}
.top_2column .news ul li a time {
    text-align: left;
    width: 22%;
    margin: 0 10px 0 0;
}
.top_2column .news ul li a p {
    width: 75%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
/* 営業日カレンダー */
.top_2column .calendar .inner {
    display: -webkit-flex;
    display: flex;
    flex-wrap: wrap;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}
.top_2column .calendar .inner .box {
    width: 49%;
}

/*----------------------------------------------------
    ログイン
    URL：/login/
----------------------------------------------------*/
.auto_login_check {
    margin: 10px 0 0 0;
}
.auto_login_check input[type="checkbox"] {
    margin: 0 5px 0 0;
    position: relative;
    top: -1px;
}
/* ログイン、パスワードお忘れなどの下段のリンク */
.inner_width .other_link {
    margin: 30px 0 0 0;
}
/* ログインパスワードの注意事項 */
.password-help-message {
    margin: 30px 0 0 0;
}
.password-help-message p {
    font-weight: bold;
    border-bottom: 1px solid #222222;
    margin: 0 0 10px 0;
}
.password-help-message ul {
    padding: 5px 0 5px 20px;
}
.password-help-message ul li {
    list-style-type: decimal;
}

/*----------------------------------------------------
    商品一覧
    URL：/products/
----------------------------------------------------*/
/* 販売する商品が無い場合 */
.products_list_level1 .no_product {
    text-align: center;
}
.products_list_level1 {
    overflow: hidden;
}
.products_list_level1 .title a {
    font-weight: 700;
    color: #000;
}
.products_list_level1 .title:before {
    content: "\f0c8";
    font-family: "Font Awesome 6 Pro";
    margin: 0 5px 0 0;
    font-size: 0.8em;
}
.products_list_level1 .product_box {
    display: -webkit-flex;
    display: flex;
    flex-wrap: wrap;
}
.products_list_level1 .box {
    width: 22.8%;
    margin: 0 25px 20px 0;
}
.products_list_level1 .box:nth-child(4n) {
    margin-right: 0;
}
.products_list_level1 .box a {
    color: #222;
}
.products_list_level1 .box .image {
    margin: 0 0 5px;
}
.products_list_level1 .box .image img {
    max-height: 100%;
    width: 100%;
}
.products_list_level1 .box .item_title {
    margin: 0 0 10px;
    border: none;
    font-weight: 400;
    padding: 0;
    text-align: center;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.products_list_level1 .box h3:before {
    content: "";
    margin: 0;
}
.products_list_level1 .box .item_description {
    font-size: 0.8em;
    margin: 0 0 5px 0;
}
.products_list_level1 .box .link {
    text-align: right;
    font-size: 0.8em;
    color: #036eb8;
}
.products_list_level1 .box .link:hover {
    text-decoration: underline;
}

/*----------------------------------------------------
    小分類ページ
    URL：/products/web_send/newyear-card/
----------------------------------------------------*/
.products_list_level2 {
    overflow: hidden;
}
/* 
デフォルト（サイズ一覧）のレイアウトの表記の場合
※通販システムの初期設定による
--------------------------------- */
.products_list_level2 .product_list {
    margin: 0 0 20px 0;
    border-top: 1px solid #ccc;
    border-right: 1px solid #ccc;
    padding: 0px;
}
.products_list_level2 .product_list li {
    border-left: 5px solid #333;
    border-bottom: 1px solid #ccc;
    position: relative;
}
.products_list_level2 .product_list li a {
    padding: 10px 25px 10px 15px;
    display: block;
}
.products_list_level2 .product_list li a:hover {
    background-color: #ebebeb;
    text-decoration: none;
}
.products_list_level2 .product_list li a span {
    color: #333;
}
.products_list_level2 .product_list li a p {
    font-weight: bold;
    margin: 0px;
}
.products_list_level2 .product_list li::before {
    position: relative;
    top: 0px;
    left: 0px;
    background-color: transparent;
    width: auto;
    height: auto;
}
.products_list_level2 .product_list li::after {
    content: "\f105";
    font-family: "Font Awesome 6 Pro";
    position: absolute;
    right: 10px;
    top: 50%;
    margin-top: -0.8em;
    font-size: 2em;
    font-weight: bold;
}

/* 
不定形サイズのレイアウトの表記の場合
※通販システムの初期設定による
--------------------------------- */
.size_serach_box {
    overflow: hidden;
    margin: 20px 0;
}

/* 入力ボックス */
.size_serach_box .inner {
    margin: 0 20px 0 0;
    float: left;
    font-size: 1.4rem;
}
.size_serach_box .inner input {
    border: 1px solid #646464 !important;
    width: 160px !important;
    border-radius: 0 !important;
    margin: 0 5px;
    color: #000;
    vertical-align: bottom;
}
.size_serach_box .inner input:first-child {
    margin-left: 0;
}
.size_serach_box .inner a {
    text-decoration: none;
}

/* 注意文章 */
.hope_limit_readme,
.size_serach_box .help {
    float: left;
    font-size: 0.9rem;
    background-color: #ebebeb;
    border-radius: 5px;
    padding: 10px;
    margin-bottom: 10px;
    color: #444444;
    overflow: hidden;
}
.hope_limit_readme ul {
    overflow: hidden;
}
.hope_limit_readme ul:first-child {
    margin: 0 0 5px 0;
}
.hope_limit_readme ul li {
    float: left;
    margin: 0 10px 0 0;
}
/* 各種サイズ */
.product_size_list {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.product_size_list li {
    width: 49%;
    margin: 0 0 23px;
    list-style: none;
    position: relative;
}
.product_size_list .wrap {
    border: 1px solid #333;
    padding: 5px 10px;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}
.product_size_list .wrap:hover {
    box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.3);
}
.product_size_list ul li:before {
    display: none !important;
    width: 0 !important;
}
.product_size_list li a {
    color: #000;
}
.product_size_list li a:hover {
    text-decoration: none;
}
.product_size_list li dl {
    padding: 8px 5px 0 5px;
    margin: 0 0 8px 0;
}
.product_size_list li dl dt {
    font-size: 1.3em;
    /* font-family: Hiragino Kaku Gothic W6 JIS2004; */
}
.product_size_list li dl dd {
    padding: 0 !important;
    overflow: hidden;
}
.product_size_list li dl dd p {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.product_size_list li .wrap:after {
    font-family: "Font Awesome 6 Pro";
    content: "\f105";
    margin: -5px 0 0 5px;
    font-weight: bold;
    font-size: 1.5em;
    position: absolute;
    top: 40%;
    right: 5%;
    margin-top: -12px;
}
/* 小分類、サイズ指定の場合の選択外の場合 */
.size_range_out {
    background-color: #aaa;
}
.size_range_out a {
    color: #c0bfb5 !important;
    cursor: not-allowed;
}
/* .size_range_out .btn_pink {
	color: #c0bfb5 !important;
} */
/* 小分類、サイズのクリア */
.size_clear {
    font-size: 0.7em;
    background: #dcdcdc;
    border: 1px solid #646464;
    padding: 4px 8px 0px 8px;
}

/* 
物販
--------------------------------- */
/* 並び替え＆ページング */
.sales-photo-list .order {
    overflow: hidden;
}
.sales-photo-list .order .pageing {
    float: left;
}
.sales-photo-list .order select {
    width: 200px;
    float: right;
}
/* 一覧 */
.sales-photo-list .image-list {
    display: flex;
    flex-wrap: wrap;
    margin: 20px 0 0 -3%;
}
.sales-photo-list .image-list .images {
    width: 22%;
    margin-left: 3%;
    margin-bottom: 30px;
}
.sales-photo-list .image-list .images a {
    display: block;
    position: relative;
    background-color: #f6f6f6;
}
.sales-photo-list .image-list .price {
    color: #d4145a;
    font-size: 17px;
    font-weight: bold;
    margin: 5px 0;
}
.sales-photo-list .image-list .author {
    font-size: 13px;
    margin-bottom: 30px;
}
.sales-photo-list .image-list .picture {
    padding: 5%;
}
.sales-photo-list .image-list .picture img {
    width: 100%;
    height: 200px;
    object-fit: contain;
    transition: 0.3s;
    opacity: 1;
}
.sales-photo-list .image-list .picture img:hover {
    transform: scale(1.1);
}
.sales-photo-list .image-list .title {
    font-size: 17px;
    font-weight: bold;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

/* ---------------- */
/* 料金表 */
/* ---------------- */
a.back {
    color: #036eb8;
}
a.view {
    font-size: 30px;
    color: #b4b9be;
    position: relative;
    top: 6px;
}

/*----------------------------------------------------
    商品ページ（物販）
----------------------------------------------------*/
.sales-item-box {
    display: -webkit-flex;
    display: flex;
    flex-wrap: wrap;
}
/* 画像 */
.sales-item-box .image {
    width: 50%;
}
.sales-item-box .image img {
    width: 100%;
    height: 500px;
    object-fit: contain;
}
/* 詳細 */
.sales-item-box .detail {
    width: 50%;
    padding-left: 5%;
}
.sales-item-box .detail.full {
    width: 100%;
}
.sales-item-box .detail dt {
    font-weight: bold;
    border-top: 1px solid #222222;
    border-bottom: 1px solid #222222;
    padding: 10px;
}
.sales-item-box .detail dt::before {
    content: "■";
}
.sales-item-box .detail dd {
    padding: 10px 0 20px 0;
}

/*----------------------------------------------------
    料金表（物販）
----------------------------------------------------*/
.sales-price-box {
    display: -webkit-flex;
    display: flex;
    flex-wrap: wrap;
    padding: 30px 0;
    border-top: 2px solid #cccccc;
}
/* 最短出荷日などの左側 */
.sales-price-box .detail {
    width: 50%;
}
.sales-price-box .detail li {
    margin: 0 0 5px 0;
}
.sales-price-box .detail li.price {
    color: #bf3361;
}
.sales-price-box .detail li.price span {
    font-size: 2rem;
}
/* 注文数などの右側 */
.sales-price-box .info {
    width: 50%;
    margin-top: auto;
}
.sales-price-box .info .number {
    margin: 0 0 10px 0;
}
.sales-price-box .info .number span.sub {
    font-weight: bold;
    display: inline-block;
    width: 80px;
    font-size: 1.3rem;
    position: relative;
    top: 5px;
}
.sales-price-box .info .number input {
    width: 85.5%;
}
/* カートに入れるボタン */
.sales-add-btn a {
    display: block !important;
    text-align: center;
    font-size: 1.5rem;
}
.sales-add-btn a.not {
    cursor: not-allowed;
    background-color: #cccccc;
}
.sales-add-btn a i {
    margin: 0 5px 0 0;
}

/*----------------------------------------------------
    見積確認画面
    URL：/systems/estimate_request/?qid=*
----------------------------------------------------*/
.estimate_request_box .info {
    text-align: center;
    margin: 0 0 50px 0;
}
.estimate_request_box .file_list {
    margin: 10px 0 0 0;
}
.estimate_request_box .file_list li:first-child {
    border-top: 1px solid #cccccc;
}
.estimate_request_box .file_list li {
    border-bottom: 1px solid #cccccc;
    padding: 10px 5px;
    overflow: hidden;
}
.estimate_request_box .file_list li span.name {
    float: left;
    position: relative;
    top: 13px;
}
.estimate_request_box .file_list li a {
    float: right;
}
.estimate_request_box p.other_attachment {
    font-weight: bold;
    margin: 30px 0 0 0;
}

/* ご注文手続き */
.estimate_request_box .reason_box {
    margin: 0 0 0 20px;
}
.estimate_request_box .reason_box ul li {
    padding: 10px 0;
}
.estimate_request_box .reason_box ul li input[type="radio"] {
    margin: 0 10px 0 0;
    padding: 0;
}
.estimate_request_box .reason_box ul li select {
    width: 320px;
}
.estimate_request_box .error_box {
    margin: 10px 0 0 0;
    padding: 0 0 0 20px;
    display: none;
}
.estimate_request_box .error_box textarea {
    margin: 0 0 10px 0;
}

/*----------------------------------------------------
    b2b、校正画面
    URL：/systems/proofreading/?qid=*
----------------------------------------------------*/
.proofreading_box .info {
    text-align: center;
    margin: 0 0 50px 0;
}
.proofreading_box .file_list {
    margin: 10px 0 0 0;
}
.proofreading_box .file_list li:first-child {
    border-top: 1px solid #cccccc;
}
.proofreading_box .file_list li {
    border-bottom: 1px solid #cccccc;
    padding: 10px 5px;
    overflow: hidden;
}
.proofreading_box .file_list li span.name {
    float: left;
    position: relative;
    top: 13px;
}
.proofreading_box .file_list li a {
    float: right;
}
.proofreading_box p.other_attachment {
    font-weight: bold;
    margin: 30px 0 0 0;
}

/* ご返答 */
.proofreading_box .reason_box {
    margin: 0 0 0 20px;
}
.proofreading_box .reason_box ul {
    margin: 0 0 30px 0;
}
.proofreading_box .reason_box ul li {
    padding: 10px 0;
}
.proofreading_box .reason_box ul li label {
    cursor: pointer;
}
.proofreading_box .reason_box ul li input[type="radio"] {
    margin: 0 10px 0 0;
    padding: 0;
}
.proofreading_box .remarks-box .sub-title {
    margin: 0 0 10px 0;
}
.proofreading_box .remarks-box .help {
    margin: 10px 0 20px 0;
}

/* 送信中 */
/* ※これはWeb入稿でも利用 */
.sending_message {
    color: #ffffff;
    text-align: center;
    position: fixed;
    z-index: 10012;
    min-width: 350px;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}