@charset "UTF-8";
/*=============================================================
04_modules
=============================================================*/
/*! button
================================================ */
.mod_btn_tel01 { margin-bottom: 6px; }
.mod_btn_tel01 a { display: block; line-height: 1; padding: 13px 0; border: 3px solid #e20; border-radius: 5px; background-color: #fff; text-decoration: none; text-align: center; box-shadow: 0 3px 0 0 rgba(0, 0, 0, .15); }
.mod_btn_tel01 a .num { font-weight: 900; font-size: 46.4px; font-size: 2.9rem; letter-spacing: .02em; }
.mod_btn_tel01 a .num:before { display: inline-block; width: 30px; height: 23px; margin: 0 4px 2px 0; background-image: url(../img/common/ico_tel_num01.png); background-repeat: no-repeat; background-size: contain; content: ""; }
.mod_btn_tel01 a .time { line-height: 1.4; font-size: 17.6px; font-size: 1.1rem; }
.mod_btn_tel01 a .time span { display: inline-block; width: 30px; height: 15px; line-height: 13px; overflow: hidden; margin-right: 3px; background-color: #333; color: #fff; font-size: 16px; font-size: 1.0rem; text-align: center; }
@media screen and (min-width: 600px) { .mod_btn_tel01 { margin-bottom: 0; } .mod_btn_tel01 a { display: table; width: 100%; line-height: 1; padding: 10px 0; border: none; border-radius: 0; text-align: left; pointer-events: none; box-shadow: none; } .mod_btn_tel01 a .num { display: table-cell; width: 394px; padding: 0; font-size: 4.8rem; vertical-align: middle; } .mod_btn_tel01 a .num:before { display: inline-block; width: 48px; height: 37px; margin: 0 7px -2px 0; background-image: url(../img/common/ico_tel_num01.png); background-repeat: no-repeat; background-size: contain; content: ""; } .mod_btn_tel01 a .time { display: table-cell; line-height: 1.4; font-size: 1.4rem; vertical-align: middle; } .mod_btn_tel01 a .time span { display: inline-block; width: 40px; height: 21px; line-height: 19px; margin-right: 6px; font-size: 1.3rem; } }
.mod_btn01 a , .mod_btn01 button { display: block; padding: 31px 0 6px 0; border: none; border-radius: 4px; background: url(../img/common/ico_btn01.png), -webkit-linear-gradient(top, #dd5335 0%, #d53d35 49%, #c70000 50%, #b70000 100%); background: url(../img/common/ico_btn01.png), linear-gradient(to bottom, #dd5335 0%, #d53d35 49%, #c70000 50%, #b70000 100%); background-repeat: no-repeat; background-position: 50% 7px,0 0; background-size: 16px auto,100%; color: #fff; font-size: 22.4px; font-size: 1.4rem; text-decoration: none; text-align: center; box-shadow: 0 3px 0 0 rgba(0, 0, 0, .15); -webkit-appearance: none; -moz-appearance: none; appearance: none; }
.mod_btn01 button { width: 100%; line-height: 1.7; font-family: -apple-system, BlinkMacSystemFont, "Noto Sans Japanese", "ヒラギノ角ゴ ProN W3", Meiryo, sans-serif; cursor: pointer; }
@media screen and (min-width: 600px) { .mod_btn01 a , .mod_btn01 button { padding: 14px 0 14px 40px; background: url(../img/common/ico_btn01.png), -webkit-linear-gradient(top, #dd5335 0%, #d53d35 49%, #c70000 50%, #b70000 100%); background: url(../img/common/ico_btn01.png), linear-gradient(to bottom, #dd5335 0%, #d53d35 49%, #c70000 50%, #b70000 100%); background-repeat: no-repeat; background-position: 99px 16px,0 0; background-size: 20px auto,100%; font-size: 1.9rem; } }
.mod_btn02 a , .mod_btn02 button { display: block; padding: 31px 0 6px 0; border: none; border-radius: 4px; background: url(../img/common/ico_btn02.png), -webkit-linear-gradient(top, #ffad44 0%, #ffa233 49%, #ff8a00 50%, #f70 100%); background: url(../img/common/ico_btn02.png), linear-gradient(to bottom, #ffad44 0%, #ffa233 49%, #ff8a00 50%, #f70 100%); background-repeat: no-repeat; background-position: 50% 7px,0 0; background-size: 25px auto,100%; color: #fff; font-size: 22.4px; font-size: 1.4rem; text-decoration: none; text-align: center; box-shadow: 0 3px 0 0 rgba(0, 0, 0, .15); -webkit-appearance: none; -moz-appearance: none; appearance: none; }
.mod_btn02 button { width: 100%; line-height: 1.7; font-family: -apple-system, BlinkMacSystemFont, "Noto Sans Japanese", "ヒラギノ角ゴ ProN W3", Meiryo, sans-serif; cursor: pointer; }
@media screen and (min-width: 600px) { .mod_btn02 a , .mod_btn02 button { padding: 14px 0 14px 40px; background: url(../img/common/ico_btn02.png), -webkit-linear-gradient(top, #ffad44 0%, #ffa233 49%, #ff8a00 50%, #f70 100%); background: url(../img/common/ico_btn02.png), linear-gradient(to bottom, #ffad44 0%, #ffa233 49%, #ff8a00 50%, #f70 100%); background-repeat: no-repeat; background-position: 53px 16px,0 0; background-size: 34px auto,100%; font-size: 1.9rem; } }
.mod_btn03 a { display: block; position: relative; padding: 13px 0; background-color: #e20; color: #fff; font-size: 22.4px; font-size: 1.4rem; text-decoration: none; text-align: center; box-shadow: 0 1px 0 0 rgba(0, 0, 0, .15); }
.mod_btn03.arw a:before { position: absolute; top: 45%; right: 10px; width: 5px; height: 5px; border-top: 2px solid #fff; border-right: 2px solid #fff; content: ""; content: ""; -webkit-transform: rotate(45deg); transform: rotate(45deg); }
@media screen and (min-width: 600px) { .mod_btn03 a { padding: 25px 0; font-size: 1.5rem; } .mod_btn03.arw a:before { right: 15px; width: 6px; height: 6px; } }
.mod_btn04 { display: table; }
.mod_btn04 a { display: table-cell; position: relative; box-sizing: border-box; width: 100%; height: 60px; line-height: 1.4; padding: 0 15px 0 42px; border: 2px solid #e20; border-radius: 5px; font-weight: bold; font-size: 22.4px; font-size: 1.4rem; vertical-align: middle; box-shadow: 0 2px 0 0 rgba(0, 0, 0, .15); }
.mod_btn04.icon01 { background: url(../img/common/sidebar/icon01.png) 10px 50% no-repeat; background-size: 26px; }
.mod_btn04.icon02 { background: url(../img/common/sidebar/icon02.png) 10px 50% no-repeat; background-size: 26px; }
.mod_btn04.arw a:before { position: absolute; top: 45%; right: 5px; width: 5px; height: 5px; border-top: 2px solid #e20; border-right: 2px solid #e20; content: ""; content: ""; -webkit-transform: rotate(45deg); transform: rotate(45deg); }
@media screen and (min-width: 600px) { .mod_btn04 { width: 100%; } .mod_btn04 a { box-sizing: border-box; height: 80px; line-height: 1.5; padding: 0 15px 0 60px; border: 3px solid #e20; font-size: 1.5rem; } .mod_btn04.icon01 { background-size: 40px; } .mod_btn04.icon02 { background-size: 40px; } .mod_btn04.arw a:before { right: 13px; width: 6px; height: 6px; } }
.mod_btn05 { text-align: center; }
.mod_btn05 a { display: inline-block; position: relative; padding: 11.5px 18px 11.5px 38px; border-radius: 6px; background: #000; color: #fff; font-size: 20.8px; font-size: 1.3rem; text-decoration: none; box-shadow: 0 2px 0 #d9d9d9; }
.mod_btn05 a:before { position: absolute; top: 50%; left: 10px; width: 12px; height: 16px; background: url(../img/common/ico_arrow02_on.png) no-repeat center; background-size: contain; content: ""; -webkit-transform: translateY(-50%); transform: translateY(-50%); }
.mod_btn05 a:hover { opacity: .7; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)"; }
@media screen and (min-width: 600px) { .mod_btn05 a { padding: 13px 19px 12px 42px; font-size: 1.6rem; } .mod_btn05 a:before { width: 8px; height: 14px; } }
.mod_btn06 { box-sizing: border-box; width: 100%; padding: 15px 25px 25px; }
.mod_btn06 a , .mod_btn06 button { display: inline-block; position: relative; width: 100%; line-height: 1; padding: 15px 0; border: none; background: #e20; color: #fff; font-size: 22.4px; font-size: 1.4rem; text-decoration: none; text-align: center; cursor: pointer; box-shadow: 0 2px 0 #d9d9d9; -webkit-appearance: none; -moz-appearance: none; appearance: none; }
.mod_btn06 a:before , .mod_btn06 button:before { display: inline-block; width: 16px; height: 15px; margin-right: 13.5px; background: url(../img/common/ico_dl.png) no-repeat center; background-size: contain; vertical-align: middle; content: ""; }
.mod_btn06.sample a , .mod_btn06.sample button { background: #f67c00; }
.mod_btn06.sample a:before , .mod_btn06.sample button:before { margin-top: -3px; background: url(../img/common/ico_sample01.png) no-repeat center; background-size: contain; }
@media screen and (min-width: 600px) { .mod_btn06 { padding: 24px 0 0; } .mod_btn06 a , .mod_btn06 button { padding: 20px 0; font-size: 1.4rem; } }
.mod_btns_bunner01 { margin-bottom: 30px; padding: 0 15px; }
.mod_btns_bunner01 .list .item { float: left; width: 49%; margin-bottom: 10px; }
.mod_btns_bunner01 .list .item:nth-child(even) { float: right; }
.mod_btns_bunner01 .list .item.check { margin-top: -5px; }
@media screen and (min-width: 600px) { .mod_btns_bunner01 { display: none; } }
@media all and (max-width: 320px) { .mod_btns_bunner01 .list .item.check { margin-top: -3px; } }
/*
#styleguide
mod_btn_tel01
mod_btn_tel01
```
```
*/
/*
#styleguide
mod_btn01
mod_btn01
```
お見積もり
```
*/
/*
#styleguide
mod_btn02
mod_btn02
```
無料サンプル請求
```
*/
/*
#styleguide
mod_btn03
mod_btn03
```
オリジナル付箋(ふせん) 一覧
```
*/
/*
#styleguide
mod_btn04
mod_btn04
```
デザイン
代行サービス
```
*/
/*! pager
================================================ */
.mod_pagination01 { margin: 20px 0 0; text-align: center; }
.mod_pagination01 li { display: inline-block; margin-right: 5px; }
.mod_pagination01 li a , .mod_pagination01 li span { display: block; width: 35px; height: 35px; line-height: 35px; border: 1px solid #e20; border-radius: 4px; background: #fff; color: #333; font-family: roboto; font-weight: bold; text-decoration: none; text-align: center; box-shadow: 0 2px 0 #d9d9d9; }
.mod_pagination01 li a:hover , .mod_pagination01 li span:hover { background-color: #e20; color: #fff; }
.mod_pagination01 li .current { background: #e20; color: #fff; }
.mod_pagination01 li .prev { border: 0; background: url(../img/common/ico_arrow02.png) no-repeat center; background-size: 8px 12.5px; box-shadow: none; }
.mod_pagination01 li .prev:hover { background-color: transparent; opacity: .7; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)"; }
.mod_pagination01 li .next { border: 0; background: url(../img/common/ico_arrow01.png) no-repeat center; background-size: 8px 12.5px; box-shadow: none; }
.mod_pagination01 li .next:hover { background-color: transparent; opacity: .7; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)"; }
@media screen and (min-width: 600px) { .mod_pagination01 li { margin-right: 10px; } .mod_pagination01 li a , .mod_pagination01 li span { width: 40px; height: 40px; line-height: 40px; border-width: 2px; font-size: 1.6rem; } .mod_pagination01 li .prev , .mod_pagination01 li .next { background-size: 8px 14px; } }
/*
#styleguide
mod_pagination01
pager
```
```
*/
/*! tit
================================================ */
.mod_head01 { text-align: center; }
@media screen and (min-width: 600px) { .mod_head01 { text-align: left; } }
.mod_tit01 { line-height: 1.3; font-size: 48px; font-size: 3.0rem; }
.mod_tit01 .bold { font-weight: 900; }
@media screen and (min-width: 600px) { .mod_tit01 { line-height: 1.0; font-size: 4.0rem; } }
.mod_tit_read01 { display: block; font-size: 19.2px; font-size: 1.2rem; }
@media screen and (min-width: 600px) { .mod_tit_read01 { display: inline-block; padding: 0 0 10px 20px; font-size: 1.6rem; } }
.mod_head02 { padding: 15px 14px; border-top: 4px solid #e20; border-bottom: 1px solid #e1e1e1; }
@media screen and (min-width: 600px) { .mod_head02 { padding: 22px 0; border-bottom: 2px solid #e1e1e1; } }
.mod_tit02 { position: relative; line-height: 1.3; padding-left: 21px; font-weight: bold; font-size: 30.4px; font-size: 1.9rem; }
.mod_tit02:before { position: absolute; top: 0; left: 0; width: 7px; height: 100%; border-radius: 2px; background-color: #e20; content: ""; }
@media screen and (min-width: 600px) { .mod_tit02 { padding-left: 30px; font-size: 3.0rem; } .mod_tit02:before { width: 10px; } }
/*
#styleguide
mod_tit01
mod_tit01
```
PICK UP実用新案本舗 ピックアップ商品
```
*/
/*
#styleguide
mod_tit02
mod_tit02
```
実用新案本舗について
```
*/
/*! box
================================================ */
.mod_cvBox01 { position: relative; box-sizing: border-box; box-sizing: border-box; padding: 20px 10px 20px; background: url(../img/common/cv/bg_cv_sp.png) 0 0 no-repeat; background-size: cover; }
.mod_cvBox01 .imgChara { position: absolute; top: -28px; right: 0; z-index: 0; width: 150px; }
.mod_cvBox01 .txtImg { position: relative; z-index: 1; width: 215px; margin-bottom: 10px; padding: 0 10px; }
.mod_cvBox01 .txtImg.is_flow { box-sizing: border-box; width: 303px; }
.mod_cvBox01 .txt { position: relative; z-index: 1; line-height: 1.6; margin-bottom: 17px; padding: 0 10px; color: #fff; font-size: 20.8px; font-size: 1.3rem; }
.mod_cvBox01 .mod_cvIn { padding: 10px; background-color: #fff; }
.mod_cvBox01 .btns .btn { float: left; width: 49%; }
.mod_cvBox01 .btns .btn + .btn { float: right; }
@media all and (min-width: 600px) { .mod_cvBox01 { width: 720px; margin: 0 auto 30px; padding: 30px 10px 10px; background: url(../img/common/cv/bg_cv_pc.png) 0 0 no-repeat; background-size: cover; } .mod_cvBox01 .imgChara { position: absolute; top: -40px; right: -10px; z-index: 0; width: 301px; } .mod_cvBox01 .txtImg { width: 440px; margin-bottom: 6px; padding: 0 20px; } .mod_cvBox01 .txtImg.is_flow { width: 376px; } .mod_cvBox01 .txt { position: relative; z-index: 1; line-height: 1.6; margin-bottom: 20px; padding: 0 20px; font-size: 1.6rem; } .mod_cvBox01 .mod_cvIn { position: relative; z-index: 1; padding: 7px 30px 20px; background-color: #fff; } .mod_cvBox01 .btns .btn { width: 315px; } }
.mod_seo_box01 { padding: 15px; }
.mod_seo_box01 .inner { padding: 15px; border: 1px solid #818181; }
.mod_seo_box01 .tit { margin-bottom: 5px; color: #818181; font-weight: bold; font-size: 19.2px; font-size: 1.2rem; }
.mod_seo_box01 .txt { color: #818181; font-size: 19.2px; font-size: 1.2rem; }
@media all and (min-width: 600px) { .mod_seo_box01 { padding: 0; } }
.mod_inner { padding: 0 15px; }
@media all and (min-width: 600px) { .mod_inner { padding: 0; } }
/*
#styleguide
mod_box01
```
```
*/
/*! mod_column01
================================================ */
.mod_columnInner01 { padding: 15px; }
@media screen and (min-width: 600px) { .mod_columnInner01 { padding: 0; } }
.mod_categoryList { letter-spacing: -.4em; }
.mod_categoryList li { display: inline-block; margin: 0 4px 5px 0; letter-spacing: .06em; }
.mod_categoryList li a { display: block; position: relative; padding: 7px 20px 7px 10px; background: #ececec; color: #333; font-size: 20.8px; font-size: 1.3rem; text-decoration: none; -webkit-transition: all .3s ease; transition: all .3s ease; }
.mod_categoryList li a:before { position: absolute; top: 50%; right: 10px; width: 6px; height: 10px; background: url(../img/common/ico_arrow01.png) no-repeat center; background-size: contain; content: ""; -webkit-transition: all .3s ease; transition: all .3s ease; -webkit-transform: translateY(-50%); transform: translateY(-50%); }
.mod_categoryList li a:hover { background: #e20; color: #fff; }
.mod_categoryList li a:hover:before { background-image: url(../img/common/ico_arrow01_on.png); }
.mod_categoryList li.current a { background: #e20; color: #fff; }
.mod_categoryList li.current a:before { background-image: url(../img/common/ico_arrow01_on.png); }
@media screen and (min-width: 600px) { .mod_categoryList { margin: 30px 0; } .mod_categoryList li a { padding: 14px 40px 14px 20px; font-size: 1.5rem; } .mod_categoryList li a:before { width: 7px; height: 12px; } }
.mod_articleList .article { padding: 20px; border: 1px solid #d9d9d9; }
.mod_articleList .article + .article { margin-top: 10px; }
.mod_articleList .article .articleHead { overflow: hidden; margin-bottom: 10px; }
.mod_articleList .article .articleHead .img { float: left; width: 100px; padding-right: 15px; }
.mod_articleList .article .articleHead .details { overflow: hidden; }
.mod_articleList .article .articleHead .details .time { display: block; line-height: 1; margin-bottom: 3px; color: #808080; font-weight: bold; font-size: 19.2px; font-size: 1.2rem; }
.mod_articleList .article .articleHead .details .category { display: inline-block; line-height: 1; padding: 5px 12px; background: #e20; color: #fff; font-size: 16px; font-size: 1rem; vertical-align: middle; box-shadow: 0 1px 0 #d9d9d9; }
.mod_articleList .article .articleHead .details .tit { display: block; line-height: 1.5; margin: 7px 0 0; color: #333; font-weight: bold; font-size: 24px; font-size: 1.5rem; word-break: break-all; }
.mod_articleList .article .articleBody > p { display: inline-block; }
.mod_articleList .article .articleBody .link { display: inline-block; margin-left: 5px; color: #e20; }
.mod_articleList .article .articleBody .link:before { display: inline-block; position: relative; width: 6px; height: 10px; margin-right: 5px; background: url(../img/common/ico_arrow01.png) no-repeat center; background-size: 6px 10px; content: ""; }
@media screen and (min-width: 600px) { .mod_articleList .article { padding: 30px; } .mod_articleList .article + .article { margin-top: 20px; } .mod_articleList .article .articleHead { margin-bottom: 16px; } .mod_articleList .article .articleHead .img { width: 150px; } .mod_articleList .article .articleHead .details .time { display: inline-block; margin: 0 10px 0 0; font-size: 1.6rem; vertical-align: middle; } .mod_articleList .article .articleHead .details .category { font-size: 1.3rem; } .mod_articleList .article .articleHead .details .tit { margin-top: 10px; font-size: 1.9rem; } }
.mod_singlePage { border-top: 1px solid #e1e1e1; }
.mod_singlePage .singleHead { padding: 15px 15px 10px; }
.mod_singlePage .singleHead .time { display: inline-block; line-height: 1; color: #808080; font-weight: bold; font-size: 19.2px; font-size: 1.2rem; vertical-align: middle; }
.mod_singlePage .singleHead .category { display: inline-block; line-height: 1; padding: 5px 12px; background: #e20; color: #fff; font-size: 16px; font-size: 1rem; vertical-align: middle; box-shadow: 0 1px 0 #d9d9d9; }
.mod_singlePage .singleHead .tit { display: block; padding-bottom: 10px; border-bottom: 1px solid #e1e1e1; color: #333; font-weight: bold; font-size: 30.4px; font-size: 1.9rem; word-break: break-all; }
.mod_singlePage .singleBody { margin-bottom: 20px; border-bottom: 1px solid #e1e1e1; }
.mod_singlePage .singleBody h2 { position: relative; margin-bottom: 14px; padding: 12px 15px 11px 30px; border-top: 4px solid #e20; border-bottom: 1px solid #e1e1e1; font-weight: bold; font-size: 30.4px; font-size: 1.9rem; }
.mod_singlePage .singleBody h2:before { position: absolute; top: 15px; left: 15px; width: 7px; height: 1.6em; border-radius: 3px; background: #e20; content: ""; }
.mod_singlePage .singleBody h3 { margin-bottom: 14px; padding: 14px 15px 7px 14px; border-bottom: 2px solid #e20; font-weight: bold; font-size: 25.6px; font-size: 1.6rem; }
.mod_singlePage .singleBody h4 { position: relative; margin-right: 15px; margin-bottom: 14px; margin-left: 15px; padding: 14px 15px 0; font-weight: bold; font-size: 22.4px; font-size: 1.4rem; }
.mod_singlePage .singleBody h4:before { position: absolute; top: 15px; left: 0; width: 5px; height: 1.6em; border-radius: 3px; background: #e20; content: ""; }
.mod_singlePage .singleBody p { margin-bottom: 14px; padding: 0 15px; }
.mod_singlePage .singleBody img { display: block; box-sizing: border-box; margin-bottom: 14px; padding: 0 15px; }
.mod_singlePage .singleBody ul { margin-bottom: 14px; padding: 0 15px; }
.mod_singlePage .singleBody ul li { margin-left: 1em; text-indent: -1em; }
.mod_singlePage .singleBody ul li:before { display: inline-block; width: 5px; height: 5px; margin-right: 10px; border-radius: 100%; background: #e20; content: ""; }
.mod_singlePage .singleBody ol { margin-bottom: 14px; padding: 0 15px; counter-reset: num 0; }
.mod_singlePage .singleBody ol li:before { display: inline-block; width: 14px; height: 14px; line-height: 14px; margin-right: 10px; border-radius: 100%; background: #e20; color: #fff; font-family: roboto; font-size: 17.6px; font-size: 1.1rem; text-align: center; content: counter(num); counter-increment: num 1; }
.mod_singlePage .singleBody blockquote { position: relative; margin-right: 20px; margin-bottom: 14px; margin-left: 20px; padding: 16px 9px; }
.mod_singlePage .singleBody blockquote:before { position: absolute; top: 0; left: -6px; width: 13px; height: 11px; background: url(../img/common/ico_blockquote.png) no-repeat center #fff; background-size: contain; content: ""; }
.mod_singlePage .singleBody blockquote:after { position: absolute; top: 15px; left: 0; width: 1px; height: calc(100% - 24px); background: #d9d9d9; content: ""; }
.mod_singlePage .singleBody a { color: #e20; }
.mod_singlePage .singleBody strong { font-weight: bold; }
@media screen and (min-width: 600px) { .mod_singlePage { margin-bottom: 40px; padding: 0 24px; border: 1px solid #e1e1e1; } .mod_singlePage .singleHead { padding: 30px 0 20px; } .mod_singlePage .singleHead .time { margin-right: 10px; font-size: 1.6rem; } .mod_singlePage .singleHead .category { font-size: 1.4rem; } .mod_singlePage .singleHead .tit { margin-top: 8px; font-size: 2.8rem; } .mod_singlePage .singleBody { border-bottom: 0; } .mod_singlePage .singleBody h2 { margin-bottom: 26px; padding: 16px 0 15px 30px; border-bottom-width: 2px; font-size: 2.6rem; } .mod_singlePage .singleBody h2:before { top: 20px; left: 0; width: 10px; } .mod_singlePage .singleBody h3 { padding: 14px 0 18px; font-size: 2.2rem; } .mod_singlePage .singleBody h4 { margin: 0 0 26px; padding: 14px 15px 0; font-size: 1.7rem; } .mod_singlePage .singleBody p { margin-bottom: 26px; padding: 0; } .mod_singlePage .singleBody img { margin-bottom: 48px; } .mod_singlePage .singleBody ul { margin-bottom: 26px; padding: 0; } .mod_singlePage .singleBody ol { margin-bottom: 26px; padding: 0; } .mod_singlePage .singleBody ol li:before { width: 18px; height: 18px; line-height: 18px; } .mod_singlePage .singleBody blockquote { margin-right: 0; margin-left: 35px; padding: 16px 15px; } .mod_singlePage .singleBody blockquote:before { top: -10px; left: -11px; width: 22px; height: 19px; } }
.mod_itemLinks { padding: 16px 15px 24px; }
.mod_itemLinks .lists .item + .item { margin-top: 8px; }
.mod_itemLinks .lists .item a { display: block; position: relative; box-sizing: border-box; line-height: 1; padding: 12.5px 0 12.5px 50px; border: 2px solid; border-radius: 6px; color: #333; font-weight: bold; font-size: 22.4px; font-size: 1.4rem; text-decoration: none; box-shadow: 0 2px 0 #d9d9d9; }
.mod_itemLinks .lists .item a:after { position: absolute; top: 50%; right: 10px; width: 4px; height: 4px; border-top: 3px solid; border-right: 3px solid; content: ""; -webkit-transform: translateY(-50%) rotate(135deg); transform: translateY(-50%) rotate(135deg); }
.mod_itemLinks .lists .item a .ico { position: absolute; top: 50%; left: 10px; width: 33px; height: 33px; border-radius: 100%; background: no-repeat center center; background-size: 20px 20px; -webkit-transform: translateY(-50%); transform: translateY(-50%); }
.mod_itemLinks .lists .item.is_fusen a { border-color: #b37a00; }
.mod_itemLinks .lists .item.is_fusen a:after { border-color: #b37a00; }
.mod_itemLinks .lists .item.is_fusen a .ico { background-color: #b37a00; background-image: url(../img/item/ico_fusen.png); background-size: 25px 20px; }
.mod_itemLinks .lists .item.is_novelty a { border-color: #167e98; }
.mod_itemLinks .lists .item.is_novelty a:after { border-color: #167e98; }
.mod_itemLinks .lists .item.is_novelty a .ico { background-color: #167e98; background-image: url(../img/item/ico_novelty.png); background-size: 16px 19px; }
.mod_itemLinks .lists .item.is_other a { border-color: #f57f00; }
.mod_itemLinks .lists .item.is_other a:after { border-color: #f57f00; }
.mod_itemLinks .lists .item.is_other a .ico { background-color: #f57f00; background-image: url(../img/item/ico_other.png); background-size: 20px 15px; }
@media all and (min-width: 600px) { .mod_itemLinks { padding: 30px 0 47px; } .mod_itemLinks .lists { display: -webkit-box; display: -ms-flexbox; display: flex; margin: 0 -8px; } .mod_itemLinks .lists .item { width: 33.333333333%; padding: 0 8px; } .mod_itemLinks .lists .item + .item { margin-top: 0; } .mod_itemLinks .lists .item a { display: -webkit-box; display: -ms-flexbox; display: flex; height: 100%; line-height: 1.5; padding: 15px 0 15px 60px; border-width: 3px; font-size: 1.5rem; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .mod_itemLinks .lists .item a:hover { opacity: .75; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=75)"; } .mod_itemLinks .lists .item a .ico { width: 40px; height: 40px; } .mod_itemLinks .lists .item.is_fusen .ico { background-size: 30px 24px; } .mod_itemLinks .lists .item.is_novelty .ico { background-size: 19px 23px; } .mod_itemLinks .lists .item.is_other .ico { background-size: 24px 19px; } }
.mod_itemList .tit01 { height: 50px; line-height: 50px; margin-bottom: 20px; color: #fff; font-weight: bold; font-size: 25.6px; font-size: 1.6rem; text-align: center; }
.mod_itemList .tit01 .ico { display: inline-block; position: relative; top: -3px; width: 25px; height: 50px; margin-right: 5px; background: no-repeat center; background-size: contain; vertical-align: middle; }
.mod_itemList .lists { padding: 0 15px; }
.mod_itemList .lists .item { overflow: hidden; padding-bottom: 15px; border-bottom: 1px solid #d9d9d9; }
.mod_itemList .lists .item:not(:first-child) { padding-top: 20px; }
.mod_itemList .lists .item .img { position: relative; float: left; box-sizing: border-box; width: 120px; padding-right: 10px; }
.mod_itemList .lists .item .img .label { display: inline-block; position: absolute; top: 0; left: 0; line-height: 1; padding: 4px 5px; color: #fff; font-size: 17.6px; font-size: 1.1rem; }
.mod_itemList .lists .item .details { overflow: hidden; }
.mod_itemList .lists .item .details .tit02 { line-height: 1.5; margin: -3px 0 5px; font-weight: bold; font-size: 25.6px; font-size: 1.6rem; }
.mod_itemList .lists .item .details .tit02 a { text-decoration: none; }
.mod_itemList .lists .item .details .tit02 a:hover { opacity: .75; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=75)"; }
.mod_itemList.is_fusen .tit01 { background-image: -webkit-linear-gradient(135deg, #b67f0a 25%, #b37a00 25%, #b37a00 50%, #b67f0a 50%, #b67f0a 75%, #b37a00 75%, #b37a00); background-image: linear-gradient(-45deg, #b67f0a 25%, #b37a00 25%, #b37a00 50%, #b67f0a 50%, #b67f0a 75%, #b37a00 75%, #b37a00); background-size: 8px 8px; }
.mod_itemList.is_fusen .tit01 .ico { background-image: url(../img/item/ico_fusen.png); }
.mod_itemList.is_fusen .lists .item .img .label { background-color: #b37a00; }
.mod_itemList.is_novelty .tit01 { background-image: -webkit-linear-gradient(135deg, #1f839c 25%, #167e98 25%, #167e98 50%, #1f839c 50%, #1f839c 75%, #167e98 75%, #167e98); background-image: linear-gradient(-45deg, #1f839c 25%, #167e98 25%, #167e98 50%, #1f839c 50%, #1f839c 75%, #167e98 75%, #167e98); background-size: 8px 8px; }
.mod_itemList.is_novelty .tit01 .ico { background-image: url(../img/item/ico_novelty.png); }
.mod_itemList.is_novelty .lists .item .img .label { background-color: #167e98; }
.mod_itemList.is_other .tit01 { background-image: -webkit-linear-gradient(135deg, #f5840a 25%, #f57f00 25%, #f57f00 50%, #f5840a 50%, #f5840a 75%, #f57f00 75%, #f57f00); background-image: linear-gradient(-45deg, #f5840a 25%, #f57f00 25%, #f57f00 50%, #f5840a 50%, #f5840a 75%, #f57f00 75%, #f57f00); background-size: 8px 8px; }
.mod_itemList.is_other .tit01 .ico { background-image: url(../img/item/ico_other.png); }
.mod_itemList.is_other .lists .item .img .label { background-color: #f57f00; }
@media all and (min-width: 600px) { .mod_itemList .tit01 { height: 62px; line-height: 62px; margin-bottom: 30px; font-size: 2rem; } .mod_itemList .tit01 .ico { width: 30px; height: 62px; margin-right: 14px; } .mod_itemList .lists { display: -webkit-box; display: -ms-flexbox; display: flex; margin: 0 -7px; padding: 0; -ms-flex-wrap: wrap; flex-wrap: wrap; } .mod_itemList .lists .item { width: calc(33.333333333333% - 14px); margin-bottom: 45px; padding: 0 7px; border-bottom: 0; } .mod_itemList .lists .item:not(:first-child) { padding-top: 0; } .mod_itemList .lists .item .img { float: none; width: 100%; padding-right: 0; padding-bottom: 15px; } .mod_itemList .lists .item .img .label { padding: 5px 7px; font-size: 1.2rem; } .mod_itemList .lists .item .details .tit02 { margin: 0 0 7px; font-size: 1.7rem; } }
/*
#styleguide
mod_column01
三カラム
```
mod_column01
```
*/
/*! contactform
================================================ */
.mod_form { padding: 0 15px 35px; }
.mod_form input[type="text"] , .mod_form input[type="email"] , .mod_form input[type="tel"] , .mod_form textarea { box-sizing: border-box; width: 100%; padding: 10px; border-radius: 6px; background: #f0f0f0; color: #333; font-size: 22.4px; font-size: 1.4rem; }
.mod_form input[type="text"]:placeholder , .mod_form input[type="email"]:placeholder , .mod_form input[type="tel"]:placeholder , .mod_form textarea:placeholder { color: #949494; }
.mod_form input[type="text"].min , .mod_form input[type="email"].min , .mod_form input[type="tel"].min , .mod_form textarea.min { width: 155px; }
.mod_form .select { position: relative; }
.mod_form .select br { display: none; }
.mod_form .select select { width: 220px; }
.mod_form .sample { display: block; width: 100%; }
.mod_form .sample .samplebtn { margin-left: 10px; }
.mod_form .sample .samplebtn a { display: inline-block; padding: 10px 22px 10px 10px; background: url(../img/common/ico_blank.png) no-repeat 95% center; background-color: #e20; background-size: 11px 11px; color: #fff; font-size: 20.8px; font-size: 1.3rem; text-decoration: none; text-align: center; }
.mod_form .sample .attention{
font-size: 1.1rem;
clear: both;
font-weight: 700;
padding-top: 14px;
display: inline-block;
}
.mod_form select { box-sizing: border-box; width: 100%; padding: 10px; border-radius: 6px; background: url(../img/common/select_bg01.png) no-repeat right top #f0f0f0; background-size: auto 100%; color: #333; font-size: 22.4px; font-size: 1.4rem; text-indent: .01px; text-overflow: ""; -webkit-appearance: none; -moz-appearance: none; appearance: none; }
.mod_form textarea { min-height: 150px; }
.mod_form select::-ms-expand { display: none; }
.mod_form #inputFile input[type="file"] { display: none; }
.mod_form #inputFile label { display: inline-block; position: relative; position: relative; box-sizing: border-box; width: 100%; padding: 10px 10px; border-radius: 6px; background: #f0f0f0; cursor: pointer; }
.mod_form #inputFile label:after { position: absolute; top: 0; right: 0; padding: 10px; border-radius: 0 6px 6px 0; background: #333; color: #fff; font-size: 19.2px; font-size: 1.2rem; content: "参照"; }
.mod_form #inputFile .filename { font-size: 12px; }
.mod_form .title { margin-bottom: 15px; font-weight: bold; font-size: 25.6px; font-size: 1.6rem; }
.mod_form .table th { display: block; }
.mod_form .table th .inset { position: relative; padding: 20px 0 10px; font-weight: bold; font-size: 24px; font-size: 1.5rem; }
.mod_form .table th .inset .ico { display: inline-block; line-height: 1; margin-left: 9px; padding: 4px 8px; background: #e20; color: #fff; font-weight: normal; font-size: 19.2px; font-size: 1.2rem; vertical-align: middle; }
.mod_form .table th .inset .ico.free { background: #bcbcbc; }
.mod_form .table td { display: block; }
.mod_form .table .address br { display: none; }
.mod_form .table .address .set { display: block; padding: 4px 0; }
.mod_form .table .address .set .zip { display: inline-block; position: relative; top: -9px; margin-right: .5em; font-size: 20.8px; font-size: 1.3rem; vertical-align: middle; }
.mod_form .agreeCheck { margin: 20px 0; padding: 20px 0; border-radius: 60px; background: #ffe4e0; color: #e20; text-align: center; }
.mod_form .agreeCheck label { position: relative; margin-left: 20px; }
.mod_form .agreeCheck label .wpcf7-list-item-label { padding-left: 10px; font-weight: bold; }
.mod_form .agreeCheck label input[type="checkbox"] { display: none; }
.mod_form .agreeCheck label input[type="checkbox"] + .wpcf7-list-item-label:before { display: inline-block; position: absolute; top: 0; left: -15px; width: 15px; height: 15px; border: 2px solid #e20; border-radius: 4px; background: #fff; vertical-align: middle; content: ""; }
.mod_form .agreeCheck label input[type="checkbox"]:checked + .wpcf7-list-item-label:after { display: block; position: absolute; top: .5em; left: -10px; width: 8px; height: 3px; border-bottom: 2px solid #e20; border-left: 2px solid #e20; content: ""; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); }
.mod_form .link { margin-bottom: 20px; text-align: center; }
.mod_form .btn { padding: 0 45px; }
.mod_form .btn br , .mod_form .btn .ajax-loader { display: none; }
.mod_form .btn input { display: block; width: 100%; margin-bottom: 10px; padding: 15px 0; border-radius: 4px; color: #fff; font-size: 22.4px; font-size: 1.4rem; text-decoration: none; text-align: center; box-shadow: 0 3px 0 0 rgba(0, 0, 0, .15); }
.mod_form .btn input.confirm , .mod_form .btn input.submit { background: url(../img/common/ico_btn01.png), -webkit-linear-gradient(top, #dd5335 0%, #d53d35 49%, #c70000 50%, #b70000 100%); background: url(../img/common/ico_btn01.png), linear-gradient(to bottom, #dd5335 0%, #d53d35 49%, #c70000 50%, #b70000 100%); background-repeat: no-repeat; background-position: 10% center; background-size: 16px auto,100%; }
.mod_form .btn input.edit { background: -webkit-linear-gradient(top, #888 0%, #999 49%, #333 50%, #444 100%); background: linear-gradient(to bottom, #888 0%, #999 49%, #333 50%, #444 100%); }
.mod_form .btn input:hover { opacity: .7; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)"; }
@media screen and (min-width: 600px) { .mod_form { margin-bottom: 50px; padding: 0; } .mod_form input[type="text"] , .mod_form input[type="email"] , .mod_form input[type="tel"] , .mod_form textarea { padding: 14px; font-size: 1.5rem; } .mod_form input[type="text"].min , .mod_form input[type="email"].min , .mod_form input[type="tel"].min , .mod_form textarea.min { width: 200px; } .mod_form .select select { width: 300px; } .mod_form .sample { overflow: hidden; } .mod_form .sample select { width: 100%; } .mod_form .sample .samplebtn { float: right; } .mod_form .sample .samplebtn a { background-color: transparent; background-image: url(../img/common/ico_blank02.png); color: #e20; font-size: 1.5rem; text-decoration: underline; } .mod_form .sample .samplebtn a:hover { text-decoration: none; } .mod_form select { padding: 14px; background: url(../img/common/select_bg02.png) no-repeat calc(100% - 20px) center #f0f0f0; font-size: 1.5rem; } .mod_form textarea { min-height: 240px; } .mod_form #inputFile label { width: 300px; padding: 14px; } .mod_form #inputFile label:after { padding: 14.5px 10px; font-size: 1.4rem; } .mod_form .title { margin-bottom: 12px; font-size: 2rem; } .mod_form .tableWrap { padding: 35px; border: 5px solid #f0f0f0; } .mod_form .tableWrap .table tr:first-child th .inset , .mod_form .tableWrap .table tr:first-child td { padding-top: 10px; } .mod_form .tableWrap .table tr:first-child th .inset .ico , .mod_form .tableWrap .table tr:first-child td .ico { top: 15px; } .mod_form .tableWrap .table tr:last-child th , .mod_form .tableWrap .table tr:last-child td { border-bottom: 0; } .mod_form .table { display: table; width: 100%; } .mod_form .table th { display: table-cell; width: 195px; padding-right: 25px; border-bottom: 1px dashed #e1e1e1; font-size: 1.6rem; } .mod_form .table th .inset { margin-top: 10px; padding: 25px 0; } .mod_form .table th .inset .ico { position: absolute; top: 30px; right: 0; font-size: 1.3rem; } .mod_form .table td { display: table-cell; padding: 25px 0; border-bottom: 1px dashed #e1e1e1; } .mod_form .table .address .set { padding: 7.5px 0; } .mod_form .table .address .set .zip { top: -10px; font-size: 1.5rem; } .mod_form .agreeCheck { font-size: 1.6rem; } .mod_form .agreeCheck label .wpcf7-list-item-label { padding-left: 20px; } .mod_form .agreeCheck label input[type="checkbox"] + .wpcf7-list-item-label:before { top: 3px; width: 16px; height: 16px; } .mod_form .agreeCheck label input[type="checkbox"]:checked + .wpcf7-list-item-label:after { top: .55em; width: 9px; height: 4px; } .mod_form .link { margin-bottom: 38px; } .mod_form .btn { padding: 0; text-align: center; } .mod_form .btn input { display: inline-block; width: 290px; margin: 0 10px 15px; padding: 27px 0; border-radius: 10px; font-size: 1.8rem; } .mod_form .btn input.confirm , .mod_form .btn input.submit { background-size: 23px auto,100%; } }
.mod_form .mw_wp_form_preview table td { box-sizing: border-box; width: 100%; padding: 10px; border-radius: 6px; background: #f1f1f1; color: #8c8c8c; font-size: 22.4px; font-size: 1.4rem; }
.mod_form .mw_wp_form_preview table td .address td { padding: 0; background: transparent; }
.mod_form .mw_wp_form_preview table td .address td .set { margin-bottom: 6px; padding: 10px; border-radius: 6px; background: #f1f1f1; }
.mod_form .mw_wp_form_preview table td .address td .set .zip { top: -1px; }
.mod_form .mw_wp_form_preview table td .sample .samplebtn { display: none; }
.mod_form .mw_wp_form_preview table td #inputFile .mw-wp-form_file { display: none; }
.mod_form .mw_wp_form_preview .agreeCheck { display: none; }
@media screen and (min-width: 600px) { .mod_form .mw_wp_form_preview .table td { width: auto; background: transparent; } .mod_form .mw_wp_form_preview .table td .address td .set { background: transparent; } .mod_form .mw_wp_form_preview .table td .address td .set .zip { top: -1px; } }
@media all and (max-width: 340px) { .mod_form .select select { width: 60%; } }
.mod_thanks { padding: 20px 15px; }
.mod_thanks p { margin-bottom: 1em; text-align: center; }
.mod_thanks .backbtn { padding: 30px 0 60px; text-align: center; }
.mod_thanks .backbtn a { color: #e20; }
@media screen and (min-width: 600px) { .mod_thanks { padding: 40px 0; } .mod_thanks .backbtn { padding: 30px 0 80px; } }
/*# sourceMappingURL=maps/modules.css.map */