/* 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;
}
/* b2b */
.b2b_login_info {
    margin: 30px 0 0 0;
}
.b2b_login_info p {
    font-weight: bold;
    border-bottom: 1px solid #222222;
    margin: 0 0 10px 0;
}
.b2b_login_info ul {
    padding: 5px 0 5px 20px;
}
.b2b_login_info 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 5 Free";
	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 5 Free";
	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 5 Free";
	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;
}


/*----------------------------------------------------
    商品ページ
    URL：/products/web_send/nakatoji/on_naka_b5/
----------------------------------------------------*/
#filter_box{
	margin:20px 0 ;
}
#filter_box .filter_items {
	overflow:hidden;
}

/* 選択項目 */
#filter_box .filter_items .filter_items_top {
    display: -webkit-flex;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin: 0 0 20px 0;
}
#filter_box .filter_items .filter_items_top .name {
    width: 35%;
    background:#bababa;
    padding: 10px;
    font-weight:700;
    font-size: 1.2rem
}
#filter_box .filter_items .filter_items_top .name .hissu {
    float:right;
    background:#cc3367;
    color:#ffffff;
    border-radius: 3px;
    font-size: 1rem;
    padding: 0 5px;
    position: relative;
    top: 2px;
}
#filter_box .filter_items .filter_items_top .choice {
	width: 63%;
}
#filter_box .filter_items .filter_items_top .choice .one {
    position: relative;
    top: 12px;
    left: 12px;
}
#filter_box .filter_items .filter_items_top .choice select {
    padding:10px;
    width:100%;
    font-size: 1rem;
}
/* macの場合 */
body.mac #filter_box .filter_items .filter_items_top .choice select {
    height: 48px;
}

/* 文章 */
#filter_box .filter_items .filter_items_bottom{
	margin: 0 0 20px 0;
}

/* ---------------- */
/* 料金表 */
/* ---------------- */
#in2cart_price_table_box {
	height: 500px;
}
#in2cart_price_table {
    margin: 0;
    border-collapse: separate;
}
#in2cart_price_table a {
    color: #036eb8;
}
#in2cart_price_table tr:hover td {
    background-color: #fffef4;
}
#in2cart_price_table th{
	text-align:center;
    position: sticky;
    top: 0;
    left: 0;
}
#in2cart_price_table th.quantity .day{
	display: block;
	font-weight: bold;
}
#in2cart_price_table td {
	text-align:center;
}
#in2cart_price_table td del {
    display: block;
}
#in2cart_price_table .tanka {
	display: none;
	margin: 0 0 0 5px;
}
.price_tanka_info {
	margin: 20px 0 0 0;
}
.price_tanka_info span {
	color: #CC3367;
}
#chk_price_tanka {
    margin: 0 5px 0 0;
    position: relative;
    top: -2px;
}
/*料金表の横スクール*/
.tbl_scroll {
	overflow: auto;
	white-space: nowrap;
	position: relative;
}
.tbl_scroll::-webkit-scrollbar {
	height: 5px;
}
.tbl_scroll::-webkit-scrollbar-track {
	background: #F1F1F1;
}
.tbl_scroll::-webkit-scrollbar-thumb {
	background: #BCBCBC;
}
/* 端数からの注文 */
.price_any_number_box {
    text-align: right;
}
.modaal_price_any_number_box #any_number {
    width: 120px;
}
.modaal_price_any_number_box .inner {
    width: 40%;
    text-align: center;
    margin: 0 auto;
}
.modaal_price_any_number_box #any_range_number {
    margin: 20px 0 0 0;
}
.modaal_price_any_number_box #any_number_price {
    width: 300px;
    margin: 0 auto;
}
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%);
}