@charset "utf-8";
/* CSS Document */



/*::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/
/*:: section分別設定                                                                                                                                                           ::*/
/*::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/

/*:: sectionの背景 ::*/
section.pageOther { }
section.pageOther.wrapper { background: linear-gradient(-225deg, #CCCCFF 0%, #EEE 56%, #99CCFF 100%); padding: 100px 0;}



/*::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/
/*:: その他ページ        　                                                                                                                                               ::*/
/*::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/
/*:: フレーム枠 ::*/
.pageOther-Frame { display: block; padding: 5% 5%; margin-bottom: 30px; background-color: #FFF; border-radius: 10px; overflow: hidden;/* 高さ認識の為 */}
.pageOther-FrameTrans { display: block; padding: 5% 5%; margin-bottom: 30px; background-color: rgba(255,255,255,0.60); border-radius: 10px; overflow: hidden;/* 高さ認識の為 */ }
.pageOther-FrameNoSetting { display: block; padding: 5% 0; margin-bottom: 30px; overflow: hidden;/* 高さ認識の為 */ }/* 枠フレームなし */
@media only screen and (max-width : 768px ){ .pageOther-Frame, .pageOther-FrameTrans { padding: 5% 5%; } }
@media only screen and (max-width : 768px ){ .pageOther-FrameNoSetting { padding: 5% 0; } }
/*:: フレーム枠の中のコンテナ ::*/
.pageOtherFrame-container { display: block; overflow: hidden;/* 高さ認識の為 */}
.pageOtherFrame-container .ItemLang { width: 100%; margin-bottom: 30px; display: block; }

/*:: その他ページ内容の設定 ::*/
.pageOther-contentsBox { display: block; height: 100%; width: 100%; margin-bottom: 30px; }
.pageOther-contentsBox ul.inBox { display: block; height: 100%; width: 100%; position: relative;}
.pageOther-contentsBox ul.inBox li.sInBoxTile { display: block; width: 150px; padding: 15px 0; clear: both; float: left; border-top: 1px dotted #ccc; }
.pageOther-contentsBox ul.inBox li.sInBoxDetails { width: -webkit-calc(100% - 150px); width: calc(100% - 150px); }
.pageOther-contentsBox ul.inBox li.sInBoxDetails { display: block; float: left; padding: 15px 0 15px 25px; border-top: 1px dotted #ccc;}
.pageOther-contentsBox ul.inBox li.sInBoxTile:first-child { border-top: 0px;}
.pageOther-contentsBox ul.inBox li.sInBoxDetails:nth-child(2) { border-top: 0px;}
@media only screen and (max-width : 768px ){
.pageOther-contentsBox { }
.pageOther-contentsBox ul.inBox li.sInBoxTile { width: 100%; float: left; padding: 20px 10px 5px 10px; font-weight: bold; font-size: 1.8rem; }
.pageOther-contentsBox ul.inBox li.sInBoxDetails { width: 100%; padding: 0px 10px 20px 10px; font-size: 1.7rem; color: #555; }
.pageOther-contentsBox ul.inBox li.sInBoxTile:first-child { padding-top: 0;}
.pageOther-contentsBox ul.inBox li.sInBoxDetails:last-child { padding-bottom: 0px;}
.pageOther-contentsBox ul.inBox li.sInBoxDetails { border-top: 0px;}
}
@media only screen and (max-width : 568px ){
.pageOther-contentsBox ul.inBox li.sInBoxDetails { font-size: 16px; font-size: 1.6rem; }
}
/*:: リスト化の設定 ::*/
.pageOther-contentsBox li.sInBoxDetails ul.listBox { width: 100%; padding: 0 0 0 0; position: relative; }
.pageOther-contentsBox li.sInBoxDetails ul.listBox li { width: 100%; margin: 10px auto; display: block; position: relative; }
.pageOther-contentsBox li.sInBoxDetails ul.listBox li:first-of-type { margin-top: 0px; }
.pageOther-contentsBox li.sInBoxDetails ul.listBox li span.none_line { display: block; padding: 0 0 0 22px;}
.pageOther-contentsBox li.sInBoxDetails ul.listBox li span.none_line::before { position: absolute; left: 0%; font-family: FontAwesome; content: "\f00c"; color: #999999; }








/*:::::::::::::::::::::::::*/
/*:: PLANの中のテーブル構造 ::*/
/*:::::::::::::::::::::::::*/

/*:: サービスページ内容のテーブル設定 ::*/
.pageService-contentsTableBox { width: 100%; margin-bottom: 30px; display: block; }
.pageService-contentsTableBox table { width: 100%; border-collapse: separate; /* 隙間をなくす */ margin-inline: auto; border-spacing: 3px; table-layout: fixed; /* 列の幅を均等にする */ }
.pageService-contentsTableBox table th { padding: 15px 10px; text-align: left; vertical-align: middle; /* 上下中央寄せ */ background-color: #3F6CFF; color: #fff; border-radius: 3px; }
.pageService-contentsTableBox table th { font-weight: normal; }
.pageService-contentsTableBox table td { padding: 5px 10px; text-align: left; vertical-align: middle; /* 上下中央寄せ */ background-color: #FFF; border-radius: 3px; }
.pageService-contentsTableBox table th:first-of-type { width: 150px!important; /* タイトル列の幅 */ }
/*:: リスト化の設定 ::*/
.pageService-contentsTableBox table td span.none_line { display: block; padding-left: 22px; position: relative; }
.pageService-contentsTableBox table td span.none_line::before { content: "\f00c"; font-family: FontAwesome; color: #999999; position: absolute; left: 0; top: 0; }
/*:: レスポンシブ ::*/
@media only screen and (max-width : 768px ){
.pageService-contentsTableBox table,
.pageService-contentsTableBox thead,
.pageService-contentsTableBox tbody,
.pageService-contentsTableBox tr,
.pageService-contentsTableBox th,
.pageService-contentsTableBox td { display: block; width: 100%!important; }
.pageService-contentsTableBox table { border-spacing: 0; table-layout: auto; }
.pageService-contentsTableBox tr { margin-bottom: 1em; }
.pageService-contentsTableBox th { padding: 5px 10px!important; }
.pageService-contentsTableBox td { background-color: transparent!important; padding: 10px!important; }
.pageService-contentsTableBox table th:first-of-type { width: 100% !important; }
}




/*::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/
/*:: アコーディオンの設定｜続きを読むをセクションごとにわける                                                                                                                          ::*/
/*::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/
/*::::::::::::::::::::::::::*/
/*:: アコーディオンの構造設定 ::*/
/*::::::::::::::::::::::::::*/
/*:: ボックス全体の設定 ::*/
.fadeMoreAccbox-container { width: 100%; padding: 0px; margin-bottom: 1px }
/*:: ラベル ::*/
.fadeMoreAccbox-container label { padding: 20px 20px; position: relative; display: block; color: #FFFFFF; background-color: #3F6CFF; border-radius: 3px; cursor : pointer; }
.fadeMoreAccbox-container label { transition: all 0.5s; }
@media only screen and (max-width : 768px ){ .fadeMoreAccbox-container label { padding: 20px 20px; } }
/*:: アイコンを表示 ::*/
.fadeMoreAccbox-container label:before { font: var(--fa-font-solid);content: "\f067"; }
.fadeMoreAccbox-container label:before { width: 5em; height: 5em; position: absolute; top: 0; right: 0; display: block; text-align: center; line-height: 5; }
.fadeMoreAccbox-container label:hover { background-color: #91ABFF; color: #333; } /*ラベルホバー時*/
.fadeMoreAccbox-container input { display: none;} /*チェックは隠す*/
@media only screen and (max-width : 1280px ){ .fadeMoreAccbox-container label:before { width: 4.5em; height: 4.5em; line-height: 4.5; } }
/*:: 中身を非表示にしておく ::*/
.fadeMoreAccbox-container .fadeMoreContent { height: 0; overflow: hidden; opacity: 0; transition: 0.8s; }
/*:: クリックで中身表示* ::*/
.fadeMoreACC:checked + label + .fadeMoreContent { height: auto; width: 100%; padding-top: 10px; opacity: 1; }
.fadeMoreACC:checked + label + .fadeMoreContent { background-color: transparent; }/*開いた時の背景色*/
.fadeMoreACC:checked + label:before { content: '\f068';} /*アイコンを入れ替える*/
.fadeMoreAccbox-container .fadeMoreContent p { }

/*::::::::::::::::::::::::*/
/*:: オープン時のコンテンツ ::*/
/*::::::::::::::::::::::::*/
/*:: ボックス全体の設定 ::*/
.page-fadeMoreCaption { display: block; padding: 5% 5%; margin-bottom: 2%; background-color: rgba(255,255,255,0.60); overflow: hidden; border: 2px solid #DDD; border-radius: 10px; }
.page-fadeMoreCaption-NoFrame { display: block; padding: 0% 0%; margin-bottom: 2%; overflow: hidden;/* 高さ認識の為 */ }
@media only screen and (max-width : 768px ){
.page-fadeMoreCaption { padding: 5% 5%; }
.page-fadeMoreCaption-NoFrame { padding: 0% 0%; }
}
/*:: 各詳細ページ ::*/
.page-fadeMoreCaption .fadeMoreCaption-container { }
ul.fadeMoreCaptionBox { display: block; overflow: hidden;/* 高さ認識の為 */}
ul.fadeMoreCaptionBox li.fadeMoreTitle { width: 100%; padding: 7px 10px 4px 10px; margin-bottom: 20px; display: block; color: #444; line-height: 1.3; border-left: 5px solid #4E4E4E; }
ul.fadeMoreCaptionBox li.fadeMoreLang {display: block; margin-bottom: 30px; text-align: left; }
ul.fadeMoreCaptionBox li.fadeMoreImg { width: 70%; display: block;  margin: 0 auto;}
ul.fadeMoreCaptionBox li.fadeMoreButton {display: block; margin-bottom: 30px; text-align: left;}
ul.fadeMoreCaptionBox li:last-child { margin-bottom: 0px!important;}
@media only screen and (max-width : 768px ){ ul.fadeMoreCaptionBox li.fadeMoreImg { width: 100%; } }
/*:: 制作の流れのナンバー付きタイトルデザイン ::*/
ul.fadeMoreCaptionBox li.fadeMoreTitleNumber { padding: 8px 0 0 68px; margin-bottom: 25px; position: relative; }
ul.fadeMoreCaptionBox li.fadeMoreTitleNumber span { padding: 8px 8px; position: absolute; top: -0; left: 0; color: #fff; background-color: #2F4DFF; border-radius: 50% }
ul.fadeMoreCaptionBox li.fadeMoreTitleNumber span:after { position: absolute; top: calc(50% - 7px); right: -11px; width: 0; height: 0; content: ''; }
ul.fadeMoreCaptionBox li.fadeMoreTitleNumber span:after { border-width: 7px 0 7px 12px; border-style: solid; border-color: transparent transparent transparent #2F4DFF; }
@media only screen and (max-width : 768px ){ ul.fadeMoreCaptionBox li.fadeMoreTitleNumber { padding: 8px 0 0 60px; } }
@media only screen and (max-width : 568px ){ ul.fadeMoreCaptionBox li.fadeMoreTitleNumber { padding: 8px 0 0 56px; } }
/*:: サブタイトル ::*/
ul.fadeMoreCaptionBox li.fadeMoresubTitle { position: relative; display: inline-block; height: 100%; margin-bottom: 30px; padding: 4px 3px 2px 3px; color: #4E4E4E; }
ul.fadeMoreCaptionBox li.fadeMoresubTitle::before, .fadeMoreCaptionBox li.fadeMoresubTitle::after { content: ''; position: absolute; bottom: -4px; left: 0; height: 4px; }
ul.fadeMoreCaptionBox li.fadeMoresubTitle::before { z-index: 2; width: 15%; background-color: #4E4E4E; }
ul.fadeMoreCaptionBox li.fadeMoresubTitle::after { width: 100%; background: repeating-linear-gradient(45deg, #fff, #fff 2px, #CCC 2px, #CCC 4px); }

/*:: アコーディオンの枠途中のタイトルデザイン ::*/
.page-fadeMoreCaption ul.fadeMoreCaptionBox ul.listBox { width: 100%; padding: 0px 0 0 0; position: relative; }
.page-fadeMoreCaption ul.fadeMoreCaptionBox ul.listBox li { width: 100%; margin: 10px auto; display: block; position: relative; }
.page-fadeMoreCaption ul.fadeMoreCaptionBox ul.listBox li:first-of-type { margin-top: 0px; }
.page-fadeMoreCaption ul.fadeMoreCaptionBox ul.listBox li span.none_line { display: block; padding: 0 0 0 22px;}
.page-fadeMoreCaption ul.fadeMoreCaptionBox ul.listBox li span.none_line::before { position: absolute; left: 0%; font-family: FontAwesome; content: "\f00c"; color: #999999; }



/*:: アコーディオンの設定｜続きを読むをセクションごとにわけるのカッティングページ専用 ::*/
/*:: アコーディオンの枠途中のタイトルデザイン ::*/
li.fadeMoreLang ul.ImgBox { display: flex;flex-wrap: wrap; margin: 0 0 0 0!important; padding: 1%;}
li.fadeMoreLang ul.ImgBox li.pathImg { width: 49.5%; padding: 0; margin: 0 0 1% 1%; min-height: auto; border: none; border-radius: 3px;}
li.fadeMoreLang ul.ImgBox li.pathImg { border: 1px dotted #ccc;}
li.fadeMoreLang ul.ImgBox li.pathImg img { width: 100%; height: auto; object-fit: cover; display: block;}
li.fadeMoreLang ul.ImgBox li.pathImg:nth-child(2n+1) { margin-left: 0;}/*3の倍数+1に適用*//*打消し用*/
@media only screen and (max-width : 768px ){
li.fadeMoreLang ul.ImgBox li.pathImg { width: 100%;}
li.fadeMoreLang ul.ImgBox li.pathImg:nth-child(1n+1) { margin-left: 0;}/*3の倍数+1に適用*//*打消し用*/
}






/*::::::::::::::::::::::::::::::::*/
/*:: 制作の流れの名kに使うコンテンツ ::*/
/*::::::::::::::::::::::::::::::::*/
/*:: 制作の流れ 8col ::*/
ul.fadeMoreCaptionBox li.productionProcess { display: flex; flex-wrap: wrap; gap: 1%; margin: 0 0 20px 0; padding: 1% 0;}
li.productionProcess ul.flowBox { display: flex; flex-wrap: wrap; min-height: 20px; margin-bottom: 1%; }
li.productionProcess ul.flowBox { width: 11.625%; padding: 5px ; border: 1px solid #968B00; background-color: #EEE; position: relative; }
li.productionProcess ul.flowBox { font-size: 13px; text-align: center; border-radius: 10px; }
li.productionProcess ul.flowBox li.flowTitle { width: 100%; display: block; color: #968B00; font-weight: bold }
li.productionProcess ul.flowBox li.flowDetails { width: 100%; display: block; line-height: 1.2 }
@media only screen and (max-width : 768px ){ li.productionProcess ul.flowBox { width: 24.25%; font-size: 12px; } }
@media only screen and (max-width : 568px ){ li.productionProcess ul.flowBox { width: 32.66%; } }

/*:: 制作の流れ 1col,2col,3col 共通ボックス構造 ::*/
ul.fadeMoreCaptionBox li.WorkProcess { display: flex; flex-wrap: wrap; gap: 2%; margin: 1% 0 2% 0; }
li.WorkProcess ul.dataBox { display: flex; flex-direction: column; align-items: flex-start; min-height: 60px; margin-bottom: 2%; padding: 30px; }
li.WorkProcess ul.dataBox { background-color: rgba(255, 255, 255, 0.6); position: relative; border: 2px solid #DDD; border-radius: 10px; }
li.WorkProcess ul.dataBox li.dataImg { display: block; height: auto; width: calc(100% + 60px); margin: 0 auto; background-color: #FFF; position: relative; }
li.WorkProcess ul.dataBox li.dataImg { border-top-left-radius: 10px; border-top-right-radius: 10px; }
li.WorkProcess ul.dataBox li.dataImg img { border-top-left-radius: 10px; border-top-right-radius: 10px; }
li.WorkProcess ul.dataBox li.dataImg { margin-left: -30px; margin-top: -30px;}
li.WorkProcess ul.dataBox li.dataTitle { width: 100%; margin: 0 auto 30px auto; padding: 30px 0 10px 0; display: block; border-bottom: 1px solid #FF5F00; }
li.WorkProcess ul.dataBox li.dataTitle { font-size: 16px; text-align: left; color: #FF5F00; font-weight: bold; line-height: 1.2; }
li.WorkProcess ul.dataBox li.dataDetails { width: 100%; padding: 0 0 5% 0; margin: 0 auto; display: block; line-height: 1.8; }
/*:: col数別で幅を調整 ::*/
li.WorkProcess.col1 ul.dataBox li.dataDetails { padding: 0 0 2% 0; }
li.WorkProcess.col1 ul.dataBox { width: 100%; }
li.WorkProcess.col2 ul.dataBox { width: 49%; }
li.WorkProcess.col3 ul.dataBox { width: 32%; }
li.WorkProcess.col1 ul.dataBox:last-child { margin-bottom: 0; }
li.WorkProcess.col2 ul.dataBox:nth-last-child(-n+2) { margin-bottom: 0; }
li.WorkProcess.col3 ul.dataBox:nth-last-child(-n+3) { margin-bottom: 0; }
/*:: レスポンシブ ::*/
@media only screen and (max-width: 768px) {
li.WorkProcess ul.dataBox { padding: 20px; }
li.WorkProcess ul.dataBox li.dataTitle { font-size: 18px; padding: 5% 0 10px 0; }
li.WorkProcess ul.dataBox li.dataDetails { line-height: 1.5; }
li.WorkProcess ul.dataBox li.dataImg { width: calc(100% + 40px); margin-left: -20px; margin-top: -20px;  }
li.WorkProcess.col3 ul.dataBox { width: 49%; }
}
@media only screen and (max-width: 568px) {
li.WorkProcess.col2 ul.dataBox,
li.WorkProcess.col3 ul.dataBox { width: 100%; }
li.WorkProcess.col1 ul.dataBox:last-child { margin-bottom: 2%; }
li.WorkProcess.col2 ul.dataBox:nth-last-child(-n+2) { margin-bottom: 2%; }
li.WorkProcess.col3 ul.dataBox:nth-last-child(-n+3) { margin-bottom: 2%; }
}
/*:: 共通化｜制作の流れ 1col,2col,3colリストデザイン ::*/
li.WorkProcess ul.dlistBox { width: 100%; padding: 0px 0 10px 0; position: relative; text-align: left; }
li.WorkProcess ul.dlistBox li { width: 100%; margin: 10px auto; display: block; position: relative; }
li.WorkProcess ul.dlistBox li:first-of-type { margin-top: 0px; }
li.WorkProcess ul.dlistBox li span.none_line { display: block; padding: 0 0 0 22px;}
li.WorkProcess ul.dlistBox li span.none_line::before { position: absolute; left: 0%; font-family: FontAwesome; content: "\f00c"; color: #999999; }



/*:: 制作の流れのナンバー付きタイトルデザイン ::*/
li.WorkProcess ul.dataBox li.fadeMoreTitleNumber { padding: 8px 0 0 68px; margin-bottom: 30px; position: relative; }
li.WorkProcess ul.dataBox li.fadeMoreTitleNumber span { padding: 8px 8px; position: absolute; top: -0; left: 0; color: #fff; background-color: #2F4DFF; border-radius: 50% }
li.WorkProcess ul.dataBox li.fadeMoreTitleNumber span:after { position: absolute; top: calc(50% - 7px); right: -11px; width: 0; height: 0; content: ''; }
li.WorkProcess ul.dataBox li.fadeMoreTitleNumber span:after { border-width: 7px 0 7px 12px; border-style: solid; border-color: transparent transparent transparent #2F4DFF; }
@media only screen and (max-width : 768px ){ li.WorkProcess ul.dataBox li.fadeMoreTitleNumber { padding: 8px 0 0 60px; } }
@media only screen and (max-width : 568px ){ li.WorkProcess ul.dataBox li.fadeMoreTitleNumber { padding: 8px 0 0 56px; } }




/*:::::::::::::::::::::::::::::::*/
/*:: 配送方法と料金のテーブル料金表 ::*/
/*:::::::::::::::::::::::::::::::*/
/*:: スクロール文字 ::*/
.scroll-hint { text-align: center; font-size: 0.9rem; color: #666; margin-bottom: 8px; }

.pageService-tableBoxPostage { width: 100%; height: 100%; margin: 0 0 30px 0; display: block; overflow-x: auto; }
.pageService-tableBoxPostage table { width: 100%; min-width: 500px; margin-inline: auto; border-collapse: separate;/*隙間をなくす*/ font-size: 1.4rem; border-spacing: 3px; }
.pageService-tableBoxPostage table td { line-height: 1.4;}
.pageService-tableBoxPostage table th,table td { padding: 10px; text-align: center;/*左右中央寄せ*/ vertical-align: middle;/*上下中央寄せ*/ background-color: #FFF; border-radius: 3px; }
.pageService-tableBoxPostage table th { background-color: #6081FF!important; color: #fff;  font-weight: 400}
.pageService-tableBoxPostage table { table-layout: fixed; /* 列の幅を均等にする */ }
.pageService-tableBoxPostage table th:first-of-type { width: 90px; /* タイトル列の幅 */ }
/*:: ヘッダー＆フッター配色 ::*/
.pageService-tableBoxPostage table thead th:not(:first-child) { background-color: #999!important; line-height: 1.4 }
.pageService-tableBoxPostage table thead th:nth-child(1) { background-color: transparent!important; }
.pageService-tableBoxPostage table tfoot th { background-color: #999 !important; color: #fff; font-weight: bold; }
.pageService-tableBoxPostage table tfoot th:nth-child(1) { background-color: transparent!important; }
/*:: 左列固定 ::*/
.pageService-tableBoxPostage table th:first-of-type { position: sticky; left: 0; z-index: 2; background-color: #6081FF!important; color: #fff; }
/*:: 横スクロール設定 ::*/
.pageService-tableBoxPostage { width:100%; position: relative; overflow-x:auto; white-space:nowrap; }
.pageService-tableBoxPostage { -ms-overflow-style: none; scrollbar-width: none; }/*Microsoft Edge,Firefoxでスクロールバーを非表示*/
.pageService-tableBoxPostage::-webkit-scrollbar { display: none; }/*ChromeとSafariでスクロールバーを非表示*/
.pageService-tableBoxPostage { min-width: 100px; }
/*:: レスポンシブ ::*/
@media only screen and (max-width : 768px ){ }

/*:::::::::::::::::::::::::::::::::::::::::*/
/*:: 配送エリアテーブル表 エリアの為のクラス付与::*/
/*:::::::::::::::::::::::::::::::::::::::::*/
.pageService-tableBoxPostage.Area table { font-size: 1.4rem; }
.pageService-tableBoxPostage.Area table th,table td { padding: 5px 10px; vertical-align: middle;/*上下中央寄せ*/ background-color: #FFF; border-radius: 3px; }
.pageService-tableBoxPostage.Area table th { background-color: #6081FF!important; color: #fff; text-align: center;/*左右中央寄せ*/ }
.pageService-tableBoxPostage.Area table td { line-height: 1.4; text-align: left;}
/*:: レスポンシブ ::*/
@media only screen and (max-width : 768px ){ .pageService-tableBoxPostage.Area table { font-size: 1.2rem; } }




/*::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/
/*:: サービスページのテーブル料金表                                                                                                                                                ::*/
/*::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/
.pageService-tableBoxPrice { width: 100%; height: 100%; margin: 0 0 30px 0; display: block; overflow: hidden; }
.pageService-tableBoxPrice table { border-collapse: separate; /* 隙間をなくす */ margin-inline: auto; width: 100%; font-size: 1.4rem; border-spacing: 3px; }
.pageService-tableBoxPrice table th,table td { padding: 10px; text-align: center; /* 左右中央寄せ */ vertical-align: middle; /* 上下中央寄せ */ background-color: #FFF; border-radius: 3px; }
.pageService-tableBoxPrice table th { background-color: #6081FF!important; color: #fff; }
.pageService-tableBoxPrice table { table-layout: fixed; /* 列の幅を均等にする */ }
.pageService-tableBoxPrice table th:first-of-type { width: 80px; /* タイトル列の幅 */ }

.pageService-tableBoxPrice table thead th:not(:first-child) { background-color: #999!important; }
.pageService-tableBoxPrice table thead th:nth-child(1) { background-color: transparent!important; }


/*::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/
/*:: サービスヒアリング構成案作成ページ        　                                                                                                                                   ::*/
/*::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/
/*:: フレーム枠 ::*/
.PageServiceCon-Frame { display: block; padding: 5% 5%; margin-bottom: 30px; background-color: #FFF; overflow: hidden;/* 高さ認識の為 */}
.PageServiceCon-FrameTrans { display: block; padding: 5% 5%; margin-bottom: 30px; background-color: rgba(255,255,255,0.40); overflow: hidden;/* 高さ認識の為 */}
.PageServiceCon-FrameNoSetting { display: block; padding: 5% 0; margin-bottom: 30px; overflow: hidden;/* 高さ認識の為 */ }/* 枠フレームなし */
@media only screen and (max-width : 768px ){ .PageServiceCon-Frame, .PageServiceCon-FrameTrans { padding: 5% 5%; } }
@media only screen and (max-width : 768px ){ .PageServiceCon-FrameNoSetting { padding: 5% 0; } }
/*:: フレーム枠の中のコンテナ ::*/
.PageServiceConFrame-container { display: block; overflow: hidden;/* 高さ認識の為 */}
.PageServiceConFrame-container .ItemLang { width: 100%; margin-bottom: 30px; display: block; }
/* フレーム枠の中のコンテナお最後のコンテナはマージン0 */
.PageServiceCon-FrameTrans .PageServiceConFrame-container:last-child { margin-bottom: 0px;}


/*:: サービスページ内容の設定 ::*/
.PageServiceCon-contentsBox { display: block; height: 100%; width: 100%; margin-bottom: 30px; }
.PageServiceCon-contentsBox { display: block; height: 100%; width: 100%; margin-bottom: 30px; }
/* コンテナボックスの中のボックス設定 */
.PageServiceCon-contentsBox ul.inBox { display: block; height: 100%; width: 100%; position: relative;}
.PageServiceCon-contentsBox ul.inBox li.boxTile { display: block; height: 100%; width: 100%; padding: 7px 10px 4px 10px; margin-bottom: 10px; }
.PageServiceCon-contentsBox ul.inBox li.boxTile { color: #4E4E4E; position: relative; border-left: 5px solid #2F4DFF; }
.PageServiceCon-contentsBox ul.inBox li.boxDetails { display: block; padding: 15px 0 30px 0; }
/*:: リスト化の設定 ::*/
.PageServiceCon-contentsBox li.boxDetails ul.listBox { width: 100%; padding: 0 0 0 0; position: relative; }
.PageServiceCon-contentsBox li.boxDetails ul.listBox li { width: 100%; margin: 10px auto; display: block; position: relative; }
.PageServiceCon-contentsBox li.boxDetails ul.listBox li:first-of-type { margin-top: 0px; }
.PageServiceCon-contentsBox li.boxDetails ul.listBox li span.none_line { display: block; padding: 0 0 0 22px;}
.PageServiceCon-contentsBox li.boxDetails ul.listBox li span.none_line::before { position: absolute; left: 0%; font-family: FontAwesome; content: "\f00c"; color: #999999; }

/* 2colの設定 */
.PageServiceCon-contentsBox ul.inBox li.col2Tile { display: block; width: 160px; padding: 15px 0; clear: both; float: left; border-top: 1px dotted #ccc; }
.PageServiceCon-contentsBox ul.inBox li.col2Details { width: -webkit-calc(100% - 160px); width: calc(100% - 160px); }
.PageServiceCon-contentsBox ul.inBox li.col2Details { display: block; float: left; padding: 15px 0 15px 25px; border-top: 1px dotted #ccc;}
.PageServiceCon-contentsBox ul.inBox li.col2Tile:first-child { border-top: 0px;}
.PageServiceCon-contentsBox ul.inBox li.col2Details:nth-child(2) { border-top: 0px;}
/*:: 2colのリスト化の設定 ::*/
.PageServiceCon-contentsBox li.col2Details ul.listBox { width: 100%; padding: 0 0 0 0; position: relative; }
.PageServiceCon-contentsBox li.col2Details ul.listBox li { width: 100%; margin: 10px auto; display: block; position: relative; }
.PageServiceCon-contentsBox li.col2Details ul.listBox li:first-of-type { margin-top: 0px; }
.PageServiceCon-contentsBox li.col2Details ul.listBox li span.none_line { display: block; padding: 0 0 0 22px;}
.PageServiceCon-contentsBox li.col2Details ul.listBox li span.none_line::before { position: absolute; left: 0%; font-family: FontAwesome; content: "\f00c"; color: #999999; }
@media only screen and (max-width : 768px ){
.PageServiceCon-contentsBox { }
.PageServiceCon-contentsBox ul.inBox li.col2Tile { width: 100%; float: left; padding: 20px 10px 5px 10px; font-weight: bold; font-size: 1.8rem; }
.PageServiceCon-contentsBox ul.inBox li.col2Details { width: 100%; padding: 0px 10px 20px 10px; color: #555; }
.PageServiceCon-contentsBox ul.inBox li.col2Details { border-top: 0px;}
.PageServiceCon-contentsBox ul.inBox li.col2Tile:first-child { padding-top: 0;}
.PageServiceCon-contentsBox ul.inBox li.col2Details:last-child { padding-bottom: 0px;}
}

/* 挿入画像 */
.PageServiceCon-contentsBox ul.inBox li.ImgBox { display: flex; flex-direction: row !important;; margin: 0 0 0 0; padding: 1%;}
.PageServiceCon-contentsBox ul.inBox li.ImgBox .RoughImg { width: 32.6666%; padding: 0; margin: 0 0 1% 1%; min-height: 50px; border: none; border-radius: 3px; }
.PageServiceCon-contentsBox ul.inBox li.ImgBox .RoughImg { border: 1px dotted #ccc;}
.PageServiceCon-contentsBox ul.inBox li.ImgBox .RoughImg img { width: 100%; height: auto; object-fit: cover; display: block;}
.PageServiceCon-contentsBox ul.inBox li.ImgBox .RoughImg:nth-child(3n+1) { margin-left: 0;}/*3の倍数+1に適用*//*打消し用*/

/*:: 制作の流れのナンバー付きタイトルデザイン ::*/
.PageServiceConFrame-container .fadeMoreTitleNumber { padding: 8px 0 0 78px; margin-bottom: 40px; position: relative; }
.PageServiceConFrame-container .fadeMoreTitleNumber:after { width: 99.8%; height: 3px; position: absolute; bottom: -8px; right: 0; content: ''; background-color: #2F4DFF; }
.PageServiceConFrame-container .fadeMoreTitleNumber span { padding: 8px 8px; position: absolute; top: -0; left: 0; color: #fff; background-color: #2F4DFF; border-radius: 3px }
.PageServiceConFrame-container .fadeMoreTitleNumber span:after { position: absolute; top: calc(50% - 7px); right: -11px; width: 0; height: 0; content: ''; }
.PageServiceConFrame-container .fadeMoreTitleNumber span:after { border-width: 7px 0 7px 12px; border-style: solid; border-color: transparent transparent transparent #2F4DFF; }
@media only screen and (max-width : 768px ){ .PageServiceConFrame-container .fadeMoreTitleNumber { padding: 8px 0 0 60px; } }
@media only screen and (max-width : 568px ){ .PageServiceConFrame-container .fadeMoreTitleNumber { padding: 8px 0 0 60px; } }



/*::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/
/*:: カッティングページ                                                                                                                                                          ::*/
/*::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/

/*:: カッティングシート別リスト ::*/
.pageService-CuttingTypeList { display: flex; flex-wrap: wrap; flex-direction: row !important;; margin: 0 0 30px 0; padding: 1%; }    
.pageService-CuttingTypeList ul.CuttingItem { width: 18.4%; padding: 0; margin: 0 0 2% 2%; min-height: 50px; border: none; }
.pageService-CuttingTypeList ul.CuttingItem:nth-child(5n+1) { margin-left: 0;}/*4の倍数+1に適用*//*打消し用*/
.pageService-CuttingTypeList ul.CuttingItem li { }
.pageService-CuttingTypeList ul.CuttingItem li.ItemTitle { display: block; position: absolute; top: 50%; left: 50%; text-align: center; width: 100%; margin-left: -50%; line-height: 1.2 }
.pageService-CuttingTypeList ul.CuttingItem li.ItemTitle { -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); }
@media only screen and (max-width : 960px ){
.pageService-CuttingTypeList ul.CuttingItem { width: 23.5%; }
.pageService-CuttingTypeList ul.CuttingItem:nth-child(5n+1) { margin-left: 2%;}/*4の倍数+1に適用*//*打消し用*/
.pageService-CuttingTypeList ul.CuttingItem:nth-child(4n+1) { margin-left: 0;}/*4の倍数+1に適用*//*打消し用*/
}
@media only screen and (max-width : 768px ){
.pageService-CuttingTypeList ul.CuttingItem { width: 32%; }
.pageService-CuttingTypeList ul.CuttingItem:nth-child(4n+1) { margin-left: 2%;}/*4の倍数+1に適用*//*打消し用*/
.pageService-CuttingTypeList ul.CuttingItem:nth-child(3n+1) { margin-left: 0;}/*4の倍数+1に適用*//*打消し用*/
}
@media only screen and (max-width : 768px ){
.pageService-CuttingTypeList ul.CuttingItem { width: 32%;}
.pageService-CuttingTypeList ul.CuttingItem:nth-child(4n+1) { margin-left: 2%;}/*4の倍数+1に適用*//*打消し用*/
.pageService-CuttingTypeList ul.CuttingItem:nth-child(3n+1) { margin-left: 0;}/*4の倍数+1に適用*//*打消し用*/
}
@media only screen and (max-width : 568px ){
.pageService-CuttingTypeList ul.CuttingItem { width: 49%;}
.pageService-CuttingTypeList ul.CuttingItem:nth-child(3n+1) { margin-left: 2%;}/*4の倍数+1に適用*//*打消し用*/
.pageService-CuttingTypeList ul.CuttingItem:nth-child(2n+1) { margin-left: 0;}/*4の倍数+1に適用*//*打消し用*/
}
/*:: コンテンツリンク設定 ::*/
.pageService-CuttingTypeList ul.CuttingItem a { display: flex; align-items: center; justify-content: center; flex-direction: column; text-align: center; position: relative; }
.pageService-CuttingTypeList ul.CuttingItem a { padding: 2%; font-family: "siclimonefit", sans-serif; font-weight: 400; font-style: normal; border-radius: 10px; }
.pageService-CuttingTypeList ul.CuttingItem a:link, ul.CuttingItem a:visited { width: 100%; height: 100%; background-color: #93B0FF; float: left; position: relative;}
.pageService-CuttingTypeList ul.CuttingItem a:link, ul.CuttingItem a:visited { background: linear-gradient(-225deg, #CCCCFF 0%, #EEE 55%, #99CCFF 100%);}
.pageService-CuttingTypeList ul.CuttingItem a:link, ul.CuttingItem a:visited { box-shadow: 0 2px 10px rgba(136, 136, 136, .25);}
.pageService-CuttingTypeList ul.CuttingItem a:link, ul.CuttingItem a:visited { transition-duration: 0.5s; }
.pageService-CuttingTypeList ul.CuttingItem a:hover{ transform: scale(1.02); transform: translateY(-2px); opacity: 0.6; transition-duration: 0.2s;overflow: hidden;}
/*:: コンテンツリンク種別背景カラー設定 ::*/
.pageService-CuttingTypeList ul.CuttingItem.G1 a:link, ul.CuttingItem.G1 a:visited { background: linear-gradient(-225deg, #CCC 0%, #DDD 25%, #EEE 50%, #DDD 75%, #BBB 100%);}

/*:: 右斜め上サークルアイコン設定 ::*/
.pageService-CuttingTypeList ul.CuttingItem .circleArrowIconBox { width: 30px; position: absolute; right: 5px; top: 5px; }/*:: アイコン本体：円＋矢印 ::*/
.circleArrow { position: relative; width: 100%; aspect-ratio: 1;/*常に正方形*/ background-color: #999; border-radius: 50%; }
.circleArrow::before { content: ""; width: 50%; height: 1px; position: absolute; top: 50%; left: 50%; background-color: #fff; transform: translate(-50%, -50%) rotate(135deg); }
.circleArrow::after { content: ""; width: 40%; height: 40%; position: absolute; top: 50%; left: 50%; border-top: 1px solid #fff; border-right: 1px solid #fff; }
.circleArrow::after { transform: translate(-50%, -50%) rotate(0deg); }
.circleArrow.blue { background-color: #557DFF; }
.circleArrow.purple { background-color: #D9A0FF; }
.pageService-CuttingTypeList ul.CuttingItem a:hover .circleArrowIconBox { right: 4px; top: 4px; transition-duration: 0.2s; transform: scale(1.02);}
/*:: 右斜め上サークルなしアイコン設定 ::*/
.pageService-CuttingTypeList ul.CuttingItem .arrowIconBox { width: 60px; position: absolute; right: -12px; top: -12px; }/*:: アイコン本体：円＋矢印 ::*/
.slantArrow { position: relative; width: 100%; aspect-ratio: 1;/*常に正方形*/ }
.slantArrow::before { content: ""; width: 40%; height: 2px; position: absolute; top: 50%; left: 50%; background-color: #666; transform: translate(-50%, -50%) rotate(135deg); }
.slantArrow::after { content: ""; width: 30%; height: 30%; position: absolute; top: 50%; left: 50%; border-top: 2px solid #666; border-right: 2px solid #666; }
.slantArrow::after { transform: translate(-50%, -50%) rotate(0deg); }
.pageService-CuttingTypeList ul.contentsItem a:hover .arrowIconBox { right: -13px; top: -13px; transition-duration: 0.2s; transform: scale(1.02);}

/*:: タイトル設定 ::*/
.pageService-CuttingTypeList ul li.ItemImgTitle { width: 90%; margin: 0 auto; padding: 10px 0 10px 0; display: block; position: relative; }
.pageService-CuttingTypeList ul li.ItemImgTitle { text-align: left; font-size: 14px; font-size: 1.4rem; line-height: 1.2; }
@media only screen and (max-width : 568px ){
.pageService-CuttingTypeList ul li.ItemImgTitle { font-size: 13px; font-size: 1.3rem; line-height: 1.2; }
}


/*:::::::::::::::::::::::::::::::::::::::::::::::::::*/
/*:: カッティングステッカーページのカッティングシートの詳細 ::*/
/*:::::::::::::::::::::::::::::::::::::::::::::::::::*/
.pageService-tableBoxCuttingMore { width: 100%; height: 100%; margin: 0 0 30px 0; display: block; overflow: hidden; }
.pageService-tableBoxCuttingMore table { border-collapse: separate; /* 隙間をなくす */ margin-inline: auto; width: 100%; font-size: 1.2rem; border-spacing: 1px; }
.pageService-tableBoxCuttingMore table th { padding: 5px 10px; text-align: center; vertical-align: middle; /* 上下中央寄せ */ background-color: #FFF; border-radius: 3px; }
.pageService-tableBoxCuttingMore table td { padding: 5px 10px; text-align: left; vertical-align: middle; /* 上下中央寄せ */ background-color: #FFF; border-radius: 3px; }
.pageService-tableBoxCuttingMore table th { background-color: #555!important; color: #fff; }
.pageService-tableBoxCuttingMore table { table-layout: fixed; /* 列の幅を均等にする */ }
.pageService-tableBoxCuttingMore table th:first-of-type { width: 80px!important; /* タイトル列の幅 */ }
/*:: フレーム枠の中のタグ付けリスト ::*/
.pageService-tableBoxCuttingMore.ItemTagList { width: 100%; display: block; }
.pageService-tableBoxCuttingMore ul.ItemTagList li { width: auto; padding: 3px 10px; margin: 0px 10px 5px 0px; display: block; background-color: #555; color: #FFF; font-size: 1.1em; }
.pageService-tableBoxCuttingMore ul.ItemTagList li { border-radius: 3px; }
.pageService-tableBoxCuttingMore ul.ItemTagList li:last-child { margin-right: 0px; }


/*:::::::::::::::::::::::::::::::::*/
/*:: カッティング料金のテーブル料金表 ::*/
/*:::::::::::::::::::::::::::::::::*/
/*:: スクロール文字 ::*/
.scroll-hint { text-align: center; font-size: 0.9rem; color: #666; margin-bottom: 8px; }

.pageService-tableBoxCutting { width: 100%; height: 100%; margin: 0 0 30px 0; display: block; overflow-x: auto; }
.pageService-tableBoxCutting table { width: 100%; min-width: 500px; margin-inline: auto; border-collapse: separate;/*隙間をなくす*/ font-size: 1.4rem; border-spacing: 3px; }
.pageService-tableBoxCutting table td { line-height: 1.4}
.pageService-tableBoxCutting table th,table td { padding: 10px; text-align: center;/*左右中央寄せ*/ vertical-align: middle;/*上下中央寄せ*/ background-color: #FFF; border-radius: 3px; }
.pageService-tableBoxCutting table th { background-color: #6081FF!important; color: #fff; }
.pageService-tableBoxCutting table { table-layout: fixed; /* 列の幅を均等にする */ }
.pageService-tableBoxCutting table th:first-of-type { width: 80px; /* タイトル列の幅 */ }
/*:: ヘッダー＆フッター配色 ::*/
.pageService-tableBoxCutting table thead th:not(:first-child) { background-color: #999!important; }
.pageService-tableBoxCutting table thead th:nth-child(1) { background-color: transparent!important; }
.pageService-tableBoxCutting table tfoot th { background-color: #999 !important; color: #fff; font-weight: bold; }
.pageService-tableBoxCutting table tfoot th:nth-child(1) { background-color: transparent!important; }
/*:: 左列固定 ::*/
.pageService-tableBoxCutting table th:first-of-type { position: sticky; left: 0; z-index: 2; background-color: #6081FF!important; color: #fff; }
/*:: 横スクロール設定 ::*/
.pageService-tableBoxCutting { width:100%; position: relative; overflow-x:auto; white-space:nowrap; }
.pageService-tableBoxCutting { -ms-overflow-style: none; scrollbar-width: none; }/*Microsoft Edge,Firefoxでスクロールバーを非表示*/
.pageService-tableBoxCutting::-webkit-scrollbar { display: none; }/*ChromeとSafariでスクロールバーを非表示*/
.pageService-tableBoxCutting { min-width: 100px; }
/*:: 税区分タグ ::*/
.pageService-tableBoxCutting span.tax { padding: 3px 8px; background-color: #EEE; border-radius: 10px; font-size: 12px;}
/*:: レスポンシブ ::*/
@media only screen and (max-width : 768px ){ .pageService-tableBoxCutting span.tax { padding: 2px 5px; font-size: 10px; border-radius: 10px; } }





/*::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/
/*:: カッティングシートカラーチャート                                                                                                                                              ::*/
/*::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/

/*:: カッティングシートカラーリスト ::*/
.pageService-CuttingColorList { display: flex; flex-wrap: wrap; gap: 1%; margin: 0 0 30px 0; padding: 1%; }
.pageService-CuttingColorList ul.C-colorItem { display: flex; align-items: flex-start; justify-content: center; height: 60px; }
.pageService-CuttingColorList ul.C-colorItem { width: 19.2%; padding: 2px 0 0 0 ; margin: 0 0 1% 0; border: none; background-color: #93B0FF; position: relative; }
.pageService-CuttingColorList ul.C-colorItem { background-size: cover; background-position: center; background-repeat: no-repeat; }
.pageService-CuttingColorList ul.C-colorItem li { }
.pageService-CuttingColorList ul.C-colorItem li.C-colorTitle { transform: none; margin: 0; width: 95%; font-size: 11px; font-weight: bold; text-align: left; line-height: 1.0; }
.pageService-CuttingColorList ul.C-colorItem li.C-colorTitle { padding: 3px 3px; display: inline-block; background-color: rgba(255, 255, 255, 0.8); border-radius: 3px;  min-height: 28px;}
/*:: レスポンシブ ::*/
@media only screen and (max-width : 768px ){ .pageService-CuttingColorList ul.C-colorItem { width: 24.25%; } }
@media only screen and (max-width : 568px ){
.pageService-CuttingColorList ul.C-colorItem { width: 32.66%; }
.pageService-CuttingColorList ul.C-colorItem li.C-colorTitle { font-size: 9px;  min-height: 25px; line-height: 1.1; }
}

.ItemColorSample { width: 100%; display: block; margin: 0px 0px 10px 0px; }
.ItemColorSample ul { width: auto; padding: 3px 10px; margin: 0px 10px 5px 0px; display: block; background-color: #555; color: #FFF; font-size: 1.1em; }
.ItemColorSample ul { border-radius: 3px; }
.ItemColorSample ul:last-child { margin-right: 0px; }

.colorItem-attention { padding: 10px 0px; display: block; font-size: 11px; line-height: 1.1; }


/*::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/
/*:: カッティングシートカラーチャート                                                                                                                                              ::*/
/*::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/
/*:: カッティングシートカラー スタンダードstd ::*/
.pageService-CuttingColorList ul.C-colorItem.std001 { background-image: url(../picCommon/page-service-cuttingColor/standard/SN-001-black.jpg); }
.pageService-CuttingColorList ul.C-colorItem.std002 { background-image: url(../picCommon/page-service-cuttingColor/standard/SN-002-white.jpg); }
.pageService-CuttingColorList ul.C-colorItem.std003 { background-image: url(../picCommon/page-service-cuttingColor/standard/SN-003-red.jpg); }
.pageService-CuttingColorList ul.C-colorItem.std004 { background-image: url(../picCommon/page-service-cuttingColor/standard/SN-004-flameRed.jpg); }
.pageService-CuttingColorList ul.C-colorItem.std005 { background-image: url(../picCommon/page-service-cuttingColor/standard/SN-005-orange.jpg); }
.pageService-CuttingColorList ul.C-colorItem.std006 { background-image: url(../picCommon/page-service-cuttingColor/standard/SN-006-yellow.jpg); }
.pageService-CuttingColorList ul.C-colorItem.std007 { background-image: url(../picCommon/page-service-cuttingColor/standard/SN-007-lemon.jpg); }
.pageService-CuttingColorList ul.C-colorItem.std008 { background-image: url(../picCommon/page-service-cuttingColor/standard/SN-008-freshGreen.jpg); }
.pageService-CuttingColorList ul.C-colorItem.std009 { background-image: url(../picCommon/page-service-cuttingColor/standard/SN-009-green.jpg); }
.pageService-CuttingColorList ul.C-colorItem.std010 { background-image: url(../picCommon/page-service-cuttingColor/standard/SN-010-skyBlue.jpg); }
.pageService-CuttingColorList ul.C-colorItem.std011 { background-image: url(../picCommon/page-service-cuttingColor/standard/SN-011-blue.jpg); }
.pageService-CuttingColorList ul.C-colorItem.std012 { background-image: url(../picCommon/page-service-cuttingColor/standard/SN-012-royalBlue.jpg); }
.pageService-CuttingColorList ul.C-colorItem.std013 { background-image: url(../picCommon/page-service-cuttingColor/standard/SN-013-navy.jpg); }
.pageService-CuttingColorList ul.C-colorItem.std014 { background-image: url(../picCommon/page-service-cuttingColor/standard/SN-014-violet.jpg); }
.pageService-CuttingColorList ul.C-colorItem.std015 { background-image: url(../picCommon/page-service-cuttingColor/standard/SN-015-purple.jpg); }
.pageService-CuttingColorList ul.C-colorItem.std016 { background-image: url(../picCommon/page-service-cuttingColor/standard/SN-016-cherryPink.jpg); }
.pageService-CuttingColorList ul.C-colorItem.std017 { background-image: url(../picCommon/page-service-cuttingColor/standard/SN-017-pink.jpg); }
.pageService-CuttingColorList ul.C-colorItem.std018 { background-image: url(../picCommon/page-service-cuttingColor/standard/SN-018-brown.jpg); }
.pageService-CuttingColorList ul.C-colorItem.std019 { background-image: url(../picCommon/page-service-cuttingColor/standard/SN-019-glay.jpg); }
.pageService-CuttingColorList ul.C-colorItem.std020 { background-image: url(../picCommon/page-service-cuttingColor/standard/SN-020-charcoal.jpg); }
.pageService-CuttingColorList ul.C-colorItem.std021 { background-image: url(../picCommon/page-service-cuttingColor/standard/SN-021-gold.jpg); }
.pageService-CuttingColorList ul.C-colorItem.std022 { background-image: url(../picCommon/page-service-cuttingColor/standard/SN-022-silver.jpg); }
.pageService-CuttingColorList ul.C-colorItem.std023 { background-image: url(../picCommon/page-service-cuttingColor/standard/SN-023-copper.jpg); }
.pageService-CuttingColorList ul.C-colorItem.stdM001 { background-image: url(../picCommon/page-service-cuttingColor/standard/SN-M001-matBlack.jpg); }
.pageService-CuttingColorList ul.C-colorItem.stdM002 { background-image: url(../picCommon/page-service-cuttingColor/standard/SN-M002-matWhite.jpg); }
.pageService-CuttingColorList ul.C-colorItem.stdM003 { background-image: url(../picCommon/page-service-cuttingColor/standard/SN-M003-matRed.jpg); }
.pageService-CuttingColorList ul.C-colorItem.stdM005 { background-image: url(../picCommon/page-service-cuttingColor/standard/SN-M005-matOrange.jpg); }
.pageService-CuttingColorList ul.C-colorItem.stdM006 { background-image: url(../picCommon/page-service-cuttingColor/standard/SN-M006-matYellow.jpg); }
.pageService-CuttingColorList ul.C-colorItem.stdM008 { background-image: url(../picCommon/page-service-cuttingColor/standard/SN-M008-matFreshGreen.jpg); }
.pageService-CuttingColorList ul.C-colorItem.stdM010 { background-image: url(../picCommon/page-service-cuttingColor/standard/SN-M010-matSkyBlue.jpg); }
.pageService-CuttingColorList ul.C-colorItem.stdM011 { background-image: url(../picCommon/page-service-cuttingColor/standard/SN-M011-matBlue.jpg); }
.pageService-CuttingColorList ul.C-colorItem.stdM013 { background-image: url(../picCommon/page-service-cuttingColor/standard/SN-M013-matNavy.jpg); }
.pageService-CuttingColorList ul.C-colorItem.stdM019 { background-image: url(../picCommon/page-service-cuttingColor/standard/SN-M019-matGlay.jpg); }
.pageService-CuttingColorList ul.C-colorItem.stdM021 { background-image: url(../picCommon/page-service-cuttingColor/standard/SN-M021-matGold.jpg); }
.pageService-CuttingColorList ul.C-colorItem.stdM022 { background-image: url(../picCommon/page-service-cuttingColor/standard/SN-M022-matSilver.jpg); }

/*:: カッティングシートカラー メタリックmet ::*/
.pageService-CuttingColorList ul.C-colorItem.met001 { background-image: url(../picCommon/page-service-cuttingColor/metallic/MS-001-black.jpg); }
.pageService-CuttingColorList ul.C-colorItem.met002 { background-image: url("../picCommon/page-service-cuttingColor/metallic/MS-002-pearl.jpg"); }
.pageService-CuttingColorList ul.C-colorItem.met003 { background-image: url("../picCommon/page-service-cuttingColor/metallic/MS-003-brightBlue.jpg"); }
.pageService-CuttingColorList ul.C-colorItem.met004 { background-image: url("../picCommon/page-service-cuttingColor/metallic/MS-004-gold.jpg"); }
.pageService-CuttingColorList ul.C-colorItem.met005 { background-image: url("../picCommon/page-service-cuttingColor/metallic/MS-005-silver.jpg"); }
.pageService-CuttingColorList ul.C-colorItem.met006 { background-image: url("../picCommon/page-service-cuttingColor/metallic/MS-006-gunmetal.jpg"); }
/*:: カッティングシートカラー メタリックミラーmetM ::*/
.pageService-CuttingColorList ul.C-colorItem.metM001 { background-image: url(../picCommon/page-service-cuttingColor/metallicMirror/MMS-001-red.jpg); }
.pageService-CuttingColorList ul.C-colorItem.metM002 { background-image: url("../picCommon/page-service-cuttingColor/metallicMirror/MMS-002-green.jpg"); }
.pageService-CuttingColorList ul.C-colorItem.metM003 { background-image: url("../picCommon/page-service-cuttingColor/metallicMirror/MMS-003-blue.jpg"); }
.pageService-CuttingColorList ul.C-colorItem.metM004 { background-image: url("../picCommon/page-service-cuttingColor/metallicMirror/MMS-004-pink.jpg"); }
.pageService-CuttingColorList ul.C-colorItem.metM005 { background-image: url("../picCommon/page-service-cuttingColor/metallicMirror/MMS-005-gold.jpg"); }
.pageService-CuttingColorList ul.C-colorItem.metM006 { background-image: url("../picCommon/page-service-cuttingColor/metallicMirror/MMS-006-silver.jpg"); }
.pageService-CuttingColorList ul.C-colorItem.metM007 { background-image: url("../picCommon/page-service-cuttingColor/metallicMirror/MMS-007-chrome.jpg"); }
/*:: カッティングシートカラー メタリックラメmetL ::*/
.pageService-CuttingColorList ul.C-colorItem.metL001 { background-image: url(../picCommon/page-service-cuttingColor/metallicLame/MGS-001-black.jpg); }
.pageService-CuttingColorList ul.C-colorItem.metL002 { background-image: url(../picCommon/page-service-cuttingColor/metallicLame/MGS-002-white.jpg); }
.pageService-CuttingColorList ul.C-colorItem.metL003 { background-image: url("../picCommon/page-service-cuttingColor/metallicLame/MGS-003-darkRed.jpg"); }
.pageService-CuttingColorList ul.C-colorItem.metL004 { background-image: url("../picCommon/page-service-cuttingColor/metallicLame/MGS-004-sapphire.jpg"); }
.pageService-CuttingColorList ul.C-colorItem.metL005 { background-image: url("../picCommon/page-service-cuttingColor/metallicLame/MGS-005-rosePink.jpg"); }
.pageService-CuttingColorList ul.C-colorItem.metL006 { background-image: url("../picCommon/page-service-cuttingColor/metallicLame/MGS-006-gold.jpg"); }
.pageService-CuttingColorList ul.C-colorItem.metL007 { background-image: url("../picCommon/page-service-cuttingColor/metallicLame/MGS-007-silver.jpg"); }
/*:: カッティングシートカラー メタリックヘアラインmetH ::*/
.pageService-CuttingColorList ul.C-colorItem.metH001 { background-image: url(../picCommon/page-service-cuttingColor/metallicHairline/MHL-001-black.jpg); }
.pageService-CuttingColorList ul.C-colorItem.metH002 { background-image: url("../picCommon/page-service-cuttingColor/metallicHairline/MHL-002-gold.jpg"); }
.pageService-CuttingColorList ul.C-colorItem.metH003 { background-image: url("../picCommon/page-service-cuttingColor/metallicHairline/MHL-003-silver.jpg"); }
.pageService-CuttingColorList ul.C-colorItem.metH004 { background-image: url("../picCommon/page-service-cuttingColor/metallicHairline/MHL-004-gunmetal.jpg"); }
.pageService-CuttingColorList ul.C-colorItem.metH005 { background-image: url("../picCommon/page-service-cuttingColor/metallicHairline/MHL-005-charcoal.jpg"); }
/*:: カッティングシートカラー 反射ref ::*/
.pageService-CuttingColorList ul.C-colorItem.ref001 { background-image: url(../picCommon/page-service-cuttingColor/reflect/RS-001-white.jpg); }
.pageService-CuttingColorList ul.C-colorItem.ref002 { background-image: url("../picCommon/page-service-cuttingColor/reflect/RS-002-red.jpg"); }
.pageService-CuttingColorList ul.C-colorItem.ref003 { background-image: url("../picCommon/page-service-cuttingColor/reflect/RS-003-orange.jpg"); }
.pageService-CuttingColorList ul.C-colorItem.ref004 { background-image: url("../picCommon/page-service-cuttingColor/reflect/RS-004-yellow.jpg"); }
.pageService-CuttingColorList ul.C-colorItem.ref005 { background-image: url("../picCommon/page-service-cuttingColor/reflect/RS-005-green.jpg"); }
.pageService-CuttingColorList ul.C-colorItem.ref006 { background-image: url("../picCommon/page-service-cuttingColor/reflect/RS-006-navy.jpg"); }
.pageService-CuttingColorList ul.C-colorItem.ref007 { background-image: url("../picCommon/page-service-cuttingColor/reflect/RS-007-purple.jpg"); }
/*:: カッティングシートカラー 反射蛍光refN ::*/
.pageService-CuttingColorList ul.C-colorItem.refN001 { background-image: url(../picCommon/page-service-cuttingColor/refrectNeon/NRS-001-green.jpg); }
.pageService-CuttingColorList ul.C-colorItem.refN002 { background-image: url("../picCommon/page-service-cuttingColor/refrectNeon/NRS-002-yellow.jpg"); }
/*:: カッティングシートカラー 蛍光neo ::*/
.pageService-CuttingColorList ul.C-colorItem.neo001 { background-image: url(../picCommon/page-service-cuttingColor/neon/NO-001-orange.jpg); }
.pageService-CuttingColorList ul.C-colorItem.neo002 { background-image: url("../picCommon/page-service-cuttingColor/neon/NO-002-lemon.jpg"); }
.pageService-CuttingColorList ul.C-colorItem.neo003 { background-image: url("../picCommon/page-service-cuttingColor/neon/NO-003-green.jpg"); }
.pageService-CuttingColorList ul.C-colorItem.neo004 { background-image: url(../picCommon/page-service-cuttingColor/neon/NO-004-orange.jpg); }





















/*::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/
/*:: トグルリストメニュー設定 CSSver                                                                                                                                              ::*/
/*::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/
.pageService-openAccList { width: 100%; margin: 0 auto; position: relative; overflow: hidden; }
.pageService-openAccList input { position: absolute; z-index: -1; opacity: 0; }
/*:: アコーディオンの開く前のボックス ::*/
.pageService-openAccList label { padding: 20px 20px; margin: 0 0 1px 0; position: relative; display: block; font-weight: bold; cursor: pointer; }
.pageService-openAccList label { color: #ffffff; background-color: #888; border-radius: 3px}/*ラベルの背景と色変更*/
@media only screen and (max-width : 768px ){ .pageService-openAccList label { padding: 20px 20px; } }
/*:: アコーディオンが閉じた状態の中身のボックス ::*/
.pageService-openAccList .openAccListContent { max-height: 0; background-color: transparent; overflow: hidden; }
.pageService-openAccList .openAccListContent { -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; -o-transition: all 0.5s; }
/*:: アコーディオンの開いた後のボックス ::*/
.pageService-openAccList input:checked ~ .openAccListContent { max-height: 100%;}
.pageService-openAccList .openAccListContent p { width: 100%; height: 100%; display: block; }
/*:: Icon ::*/
.pageService-openAccList label::after { width: 5em; height: 5em; position: absolute; top: 0; right: 0; display: block; text-align: center; line-height: 5; }
.pageService-openAccList label::after { -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; -o-transition: all 0.5s; }
.pageService-openAccList input[type=checkbox] + label::after { content: '+'; }
.pageService-openAccList input[type=checkbox]:checked + label::after { transform: rotate(315deg); }
@media only screen and (max-width : 1280px ){ .pageService-openAccList label::after { width: 4.5em; height: 4.5em; line-height: 4.5; } }
/*:: クリックするした要素のスピード ::*/
.pageService-openAccList .openToggle:checked + .openToggleTitle + .openAccListContent { max-height: 1000px; transition: all 1.5s; }
/*::::::::::::::::::::*/
/*:: 開いた要素の装飾 ::*/
/*::::::::::::::::::::*/
.pageService-openAccList .openAccListContent ul.openAccBox { padding: 5% 5%; display: block; background-color: #fff; margin : 30px 0}
.pageService-openAccList .openAccListContent ul.openAccBox li.openAccTitle { width: 100%; padding: 7px 10px 4px 10px; margin-bottom: 30px; display: block; }
.pageService-openAccList .openAccListContent ul.openAccBox li.openAccTitle { color: #FFF; line-height: 1.3; border-left: 5px solid #4E4E4E; }
.pageService-openAccList .openAccListContent ul.openAccBox li.openAcclang { display: block; padding: 0 10px; margin-bottom: 30px; text-align: left; }
@media only screen and (max-width : 768px ){ .pageService-openAccList .openAccListContent ul.openAccBox { padding: 6% 0px; } }
/*:: アコーディオンの枠途中のタイトルデザイン ::*/
.pageService-openAccList ul.openAccBox .listBox { width: 100%; padding: 0px 0 0 0; position: relative; }
.pageService-openAccList ul.openAccBox .listBox li { width: 100%; margin: 10px auto; display: block; position: relative; }
.pageService-openAccList ul.openAccBox .listBox li:first-of-type { margin-top: 00px; }
.pageService-openAccList ul.openAccBox .listBox li span.none_line { display: block; padding: 0 0 0 22px;}
.pageService-openAccList ul.openAccBox .listBox li span.none_line::before { position: absolute; left: 0%; font-family: FontAwesome; content: "\f00c"; color: #999999; }













/*::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/
/*:: PLAN項目                                                                                                                                                                  ::*/
/*::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::*/
/*:: サービスページ内容の設定 ::*/
.pageService-PlanBox { display: block; height: 100%; width: 100%; margin-bottom: 30px; }
ul.planInBox { width: 100%; display: block; background-color: #3F6CFF; border-radius: 3px; }
ul.planInBox li.planInBoxTile { width: 100%; padding: 10px; margin-bottom: 10px; display: block; color: #FFF;}
ul.planInBox li.planInBoxDetails { width: 100%; margin-bottom: 10px; padding: 10px; display: block; background-color: #FFF; }

/*:: 制作料金の設定 ::*/
/* ===== 強制的に左右横並び：左250px固定、右可変 ===== */
.planInBoxDetails { display: flex !important; flex-direction: row !important; align-items: flex-start !important; justify-content: flex-start !important; gap: 20px !important; }
.planInBoxDetails { background: #fff; padding: 20px !important; border-radius: 3px; }
/* 左側：固定幅 */
.planProductionLeftBox { flex: 0 0 200px !important; width: 200px !important; }
/* 右側：可変幅 */
.planProductionRightBox { flex: 1 1 auto !important; min-width: 160px; padding-left: 16px; }
/* 左内側：タイトル＋画像 */
.pL-Tilte { margin-bottom: 10px; font-weight: 700; color: #246DFF; }
.pL-Img,.pImg { width: 80%; border-radius: 6px; padding: 10px; display: grid; aspect-ratio: 1 / 1; background: #f1f3f6; border: 1px solid #CCC; place-items: center; }
.pL-Img img,.pImg img { max-width: 100%; max-height: 100%; display: block; }
/* 右：タイトル・価格 */
.planP-Tilte { font-weight: 700; color: #246DFF; padding-bottom: 8px; border-bottom: 2px solid #246DFF; margin-bottom: 8px; }
.planP-PriceBOX { display: flex; align-items: baseline; justify-content: flex-start; gap: 10px; padding: 8px 0; border-bottom: 1px solid #e6ebf2; }
.planP-PriceBOX:last-child { border-bottom: none; }
.planP-LangBOX { display: flex; margin-top: 10px; font-size: 1.4rem; }
/* ラベル（片面／両面） */
.PriceBOX-label { flex: 0 0 40px; font-weight: 700; color: #222; text-align: left; }
/* 金額部 */
.PriceBOX-value { flex: 1 1 auto; font-weight: 700; text-align: left; }
/* （税込）を小さく＋少し余白 */
.PriceBOX-value .tax { font-size: 0.85em; color: #555; margin-right: 4px; letter-spacing: -0.02em; }

@media (max-width: 568px) {/* スマホ時は縦積み */
.planInBoxDetails { flex-direction: column !important; padding: 10px !important; margin-top: 10px !important; }
.planProductionRightBox { border-left: none; padding-left: 0; padding-top: 0px; }
/* 横幅いっぱいにする */
.pageService-PlanBox,
.planInBox,
.planProductionLeftBox,
.planProductionRightBox { max-width: 100% !important; width: 100% !important; margin: 0 !important; padding-left: 0; padding-right: 0; }
 /* 正方形のまま縮小。中央寄せ */
.pL-Img,.pImg { width: 60% !important; /* 小さくしたい割合を調整（50〜80%で好みへ）*/ margin: 8px auto 12px; padding: 8px; aspect-ratio: 1 / 1; }
.pL-Img img,.pImg img { max-width: 100%; max-height: 100%; display: block; }
.pL-Tilte { text-align: center !important; }
.planP-LangBOX { font-size: 1.3rem; }
}

/*:: 印刷料金＆納期の設定 ::*/
ul.planContentsLangBox { width: 100%; }
ul.planContentsLangBox li.planContents-Lang { width: 100%; }