@charset "utf-8";
/* default */
@import url("/css/usr/shared/responsive/lightbox.min.css");
@import url("/css/usr/shared/responsive/responsive.gs.24col2.css");
@import url('https://use.fontawesome.com/releases/v6.4.2/css/all.css');
@import url("common.css");
@import url("shopping.css");

/* 最新号用 */
@import url("paintcraft28.css");

/* *******************************************************************　*/
/* 各ページ共通 ******************************************************　*/
/* *******************************************************************　*/
/* ヘッダー共通 */
h1.headerImg,
h1.headerImg a,
h1.headerImg img {
 line-height: 0;
 margin: 0;
 padding: 0;
}
.navPaint{
 display: block;
 margin: 0;
 width: 100%;
}
.navPaint ul li{
 line-height: 0;
 /*width: 16.6666666667%; 6つメニュー用*/
 /*width: 14.2857142857%; /*7つメニュー用*/
 width: 25%; /*8つメニュー用*/
 /*width: 20%; 5つメニュー用*/
 padding: 0.3%;
 text-align: center;
}
.navPaint ul li a{
 display: block;
 padding: 10px 5px;
}
/* ページ共通 */
.mainContents{
 padding: 15px;
}
@media print, screen and (min-width: 600px) {
/* ページ共通 */
.navPaint ul li{
 /*width: 16.6666666667%; 6つメニュー用*/
 /*width: 14.2857142857%; /*7つメニュー用*/
 width: 12.5%; /*8つメニュー用*/
 /*width: 10%; /*10個メニュー用*/
 padding: 0%;
}
.mainContents{
 padding: 1%;
}
.mainContents .span_18{
 margin-top: 10px;
 padding-right: 15px;
}
.mainContents .span_6{
 border-top: 0;
 margin-top: 20px;
 padding-left: .5em;
 padding-top: 0;
}
.mainContents .span_6 .btnSide{
 margin: 0;
}
.mainContents h1.pageTtl{
 font-size: 38px;
 /*font-size: 3.8rem;*/
}
/*サイドメニューボタン共通 */
.mainContents .span_6 .sideMenu ul{
 display: block;
 margin: 10% 0;
}
.mainContents .span_6 .sideMenu ul li{
 border-bottom: 1px solid #dcdcdc;
 list-style: none;
 padding: 0 0 0 1.6em;
 margin: 0 auto;
 width: 100%;
}
.mainContents .span_6 .sideMenu ul li:first-child{
 border-top: 1px solid #dcdcdc;
}
.mainContents .span_6 .sideMenu ul li a{
 color: #333;
 display: block;
 font-size: 13px;
 letter-spacing: 0;
 margin: 0;
 padding: 5px 10px 5px 0;
}
.mainContents .span_6 .sideMenu li a::before{
 content: "\f0a9";
 display: inline-block;
 font-family: "FontAwesome";
 margin-top: -5px;
 margin-left: -1.4em;
 width: 1.4em;
}
.mainContents .span_6 .sideMenu li a:hover{
 /*background: #f1f1f1;*/
}
}
@media print, screen and (min-width: 768px){
/* ページ共通 */
.mainContents{
 padding: 1%;
}
.mainContents .span_18{
 margin-top: 10px;
 padding-right: 15px;
}
.mainContents .span_6{
 border-top: 0;
 margin-top: 20px;
 padding-left: .5em;
 padding-top: 0;
}
.mainContents .span_6 .btnSide{
 margin: 0;
}
.mainContents h1.pageTtl{
 font-size: 38px;
 /*font-size: 3.8rem;*/
}
/*サイドメニューボタン共通 */
.mainContents .span_6 .sideMenu ul{
 display: block;
 margin: 10% 0;
}
.mainContents .span_6 .sideMenu ul li{
 border-bottom: 1px solid #dcdcdc;
 list-style: none;
 padding: 0 0 0 1.6em;
 margin: 0 auto;
 width: 100%;
}
.mainContents .span_6 .sideMenu ul li:first-child{
 border-top: 1px solid #dcdcdc;
}
.mainContents .span_6 .sideMenu ul li a{
 color: #333;
 display: block;
 font-size: 14px;
 /*font-size: 1.4rem;*/
 letter-spacing: .05em;
 margin: 0;
 padding: 10px 10px 10px 0;
}
.mainContents .span_6 .sideMenu li a::before{
 content: "\f0a9";
 display: inline-block;
 font-family: "FontAwesome";
 margin-top: -5px;
 margin-left: -1.4em;
 width: 1.4em;
}
}
/* *******************************************************************　*/
/* デザインズホーム ******************************************************　*/
/* *******************************************************************　*/
#indexWrap #latestBook{
 padding: 2.5em 1em;
}
#indexWrap #latestBook img{
 padding: 0 1em .3em;
}
#indexWrap #latestBook .bookPrice{
 font-size: 13px;
 letter-spacing: .1em;
 margin-bottom: 2.5em;
 text-align: center;
}
#indexWrap #latestBook ul.contentsList{
list-style: none;
padding-left: 1em;
}
#indexWrap #latestBook ul.contentsList li{
position: relative;
padding-left:  .4em;
padding-bottom: .4em;
}
#indexWrap #latestBook ul.contentsList li:before{
font-family: "FontAwesome";
content: "\f14a";
position: absolute;
left: -1em;
top: 0;
}
#indexWrap #latestBook ul.contentsList li ul li:before{
content: "";
}
#indexWrap #latestBook h1{
 font-family: "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;
 font-size: 30px;
 line-height: 4.5rem;
 font-weight: bold;
 margin-bottom: 1%;
}
#indexWrap #latestBook h1 span{
 font-size: 18px;
 padding-right: .5rem;
}
#indexWrap section.indexContents h2{
 position: relative;
 text-align: center;
 margin: 0 0 1em;
 padding: .5em 0;
}
#indexWrap section.indexContents h2 span{
 position: relative;
 z-index: 1;
 display: inline-block;
 margin: 0 1em;
 padding: 0 .3em;
 background-color: #fff;
 text-align: left;
}
#indexWrap section.indexContents h2::before{
 position: absolute;
 top: 50%;
 z-index: 1;
 content: '';
 display: block;
 width: 100%;
 height: 1px;
 background: #ccc;
 background: -webkit-linear-gradient(-45deg, transparent, #ccc 10%, #ccc 90%, transparent);
 background: linear-gradient(-45deg, transparent, #ccc 10%, #ccc 90%, transparent);
}
#indexWrap .indexContents li{
 margin-bottom: 3%;
}
#indexWrap .indexContents h3{
 border-top: 1px solid #dcdcdc;
 margin-top: 1em;
 padding: 1em .5em;
}
#indexWrap .indexContents h3.brdrNo{
 border-top: none;
 margin-top: 0;
}
#indexWrap #infoArea .gutters2{
 margin: 0 1em;
}
#indexWrap #infoArea .profArea{
 background: #f3f8f9;
 margin: 1em;
 padding: 1em;
}
#indexWrap #infoArea .profArea dt.span_3{
 margin-left: 0;
}
#indexWrap #infoArea .profArea .span_5{
 width: 19.25%;
}
#indexWrap #infoArea .profArea .span_19{
 width: 78.75%;
}
#indexWrap #infoArea a.snsBnr{
 -moz-border-radius: 10px;
 -webkit-border-radius: 10px;
 border-radius: 10px;
 color: #fff;
 display: block;
 padding: 1em .5em;
 margin: 1em auto;
 text-align: center;
 text-decoration: none;
}
#indexWrap #infoArea a.facebook{
 background: #265a96;
}
#indexWrap #infoArea a.facebook::after{
 content: "\00a0\f230";
 font-family: "FontAwesome";
}
#indexWrap #infoArea a.twitter{
 background: #000;
}
#indexWrap #infoArea a.twitter::after{
 content: "\00a0";
 font-family: "FontAwesome";
}
#indexWrap #infoArea a.instagram{
 background: #e1306c;
}
#indexWrap #infoArea a.instagram::after{
 content: "\00a0\f16d";
 font-family: "FontAwesome";
}
#indexWrap #infoArea a.youtube{
 background: #cd201f;
}
#indexWrap #infoArea a.youtube::after{
 content: "\00a0\f167";
 font-family: "FontAwesome";
}
#indexWrap #infoArea a.blog{
 background: #888888;
}
#indexWrap #infoArea a.blog::after{
 content: "\00a0\f044";
 font-family: "FontAwesome";
}
#indexWrap .zoom-detail em{
 font-weight: bold;
}
#indexWrap #zoom .zoom-cap{
 font-size: 13px;
 text-align: right;
}
#indexWrap .zoom-detail em::before{
 content: "\f111";
 font-family: "FontAwesome";
 margin-right: .2em;
}
.subscription-privilege .privilege .privilege-datail.pdesigns {
  padding: 15px 10px;
}

@media print, screen and (min-width: 600px) {
#indexWrap #latestBook h1{
 font-size: 38px;
}
.tachiyomi{
 display: block;
}
/* デザインズホーム バックナンバー */
#indexWrap #backnumber{
 padding: 0 2em;
}
#indexWrap #backnumber h1{
 text-align:center;
}
#indexWrap #backnumber h1 img{
 margin: 1em;
}
#indexWrap #backnumber #latestBook{
 padding: 2em;
}
#indexWrap #backnumber #latestBook h1{
 margin-bottom: 1em;
 text-align:left;
}
}
@media print, screen and (min-width: 768px){
#indexWrap #latestBook h1{
 font-size: 38px;
}
.tachiyomi{
 display: block;
}
#indexWrap #backnumber{
 padding: 0 2em;
}
#indexWrap #backnumber h1{
 text-align:center;
}
#indexWrap #backnumber h1 img{
 margin: 1em;
}
#indexWrap #backnumber #latestBook{
 padding: 2em;
}
#indexWrap #backnumber #latestBook h1{
 margin-bottom: 1em;
 text-align:left;
}
}

/* *******************************************************************　*/
/* ギャラリー ******************************************************　*/
/* *******************************************************************　*/
#galleryWrap .span_4{
 width: 32.0%;
}
#galleryWrap .span_4{
 margin-left: 1%;
}
#galleryWrap .span_4 p{
 margin-bottom: 0;
}
#galleryWrap .span_4:fisrt-child{
 margin-left: 0;
}
@media print, screen and (min-width: 600px) {
#galleryWrap{
 margin-bottom: 2%;
}
#galleryWrap .span_24{
 padding-right: 1%;
}
#galleryWrap .span_4{
 width: 15.5%;
}
#galleryWrap .span_4:fisrt-child{
 margin-left: 0;
}
}
@media print, screen and (min-width: 768px){
#galleryWrap{
 margin-bottom: 2%;
}
#galleryWrap .span_24{
 padding-right: 1%;
}
#galleryWrap .span_4{
 width: 15.5%;
}
#galleryWrap .span_4:fisrt-child{
 margin-left: 0;
}
}
/* *******************************************************************　*/
/* 動画アーカイブ ****************************************************　*/
/* *******************************************************************　*/
#movieWrap .youtubeWrap{
 padding-right: 0;
}
#movieWrap .btnLGray{
 margin-bottom: 5%;
}
#movieWrap .txtR1{
 border-bottom: 1px dotted #ccc;
 padding-bottom: 2%;
 margin-bottom: 2%;
 text-align: right;
}
#movieWrap .youtubeWrap .youtube{
 position:relative;
 width:98%;
 padding-top:55%;
}
#movieWrap .youtubeWrap .youtube iframe{
 position:absolute;
 top:0;
 right:0;
 width:100%;
 height:100%;
}
#movieWrap .youtubeWrap .youtube iframe:last-child{
 margin-bottom: 100em;
}
#movieWrap .btnYoutube a{
 background: rgba(179,18,23,0.1);
 border: 2px solid #b31217;
 -moz-border-radius: 20px;
 -webkit-border-radius: 20px;
 border-radius: 20px;
 color: #000;
 display: block;
 padding: 1px 2px 5px;
 margin: 10px;
 text-align: center;
 text-decoration: none;
}
#movieWrap .btnYoutube a::after{
 color: #b31217;
 content: "\00a0\f167";
 font-family: "FontAwesome";
 font-size: 25px;
}
#movieWrap .btnYoutube a:hover{
 background: rgba(179,18,23,0.3);
}
#movieWrap .puMovie{
 position: relative;
 height: 50px;
 letter-spacing: .1em;
 line-height: 50px;
 padding: 0 .5em;
 margin-bottom: 2%;
}
#movieWrap .puMovie::after{
 content: '';
 position: absolute;
}
#movieWrap .puMovie::after{
 top: 0;
 right: 0;
 z-index: 2;
 border-width: 25px 20px;
 border-style: solid;
 border-color: transparent;
 border-right-color: #fff;
}
#movieWrap .movieArchives{
 margin-bottom: 1em;
 padding: .1em 0;
}
#movieWrap .movieArchives h2{
 background: #ededed;
 border-left: 10px solid #ccc;
 margin-bottom: .5em;
 padding: .3em;
 font-size: 16px;
 line-height: 3rem;
}
@media print, screen and (min-width: 600px) {
#movieWrap .youtubeWrap{
 padding-left: 2%;
}
#movieWrap .movieArchives{
 padding: .5em;
}
#movieWrap .movieArchives h2{
 font-size: 25px;
 /*font-size: 2.5rem;*/
 letter-spacing: .15rem;

 line-height: 3.75rem;
}
#movieWrap .mrgn100{
 margin-bottom: 10em;
}
@media print, screen and (min-width: 768px){
#movieWrap .youtubeWrap{
 padding-left: 2%;
}
#movieWrap .movieArchives{
 padding: .5em;
}
#movieWrap .movieArchives h2{
 font-size: 25px;
 /*font-size: 2.5rem;*/
 letter-spacing: .15rem;
 line-height: 3.75rem;
}
#movieWrap .mrgn100{
 margin-bottom: 10em;
}
}
/* *******************************************************************　*/
/* 作家リスト ********************************************************　*/
/* *******************************************************************　*/
#listWrap .puPainter{
 position: relative;
 height: 50px;
 letter-spacing: .1em;
 line-height: 50px;
 padding: 0 .5em;
 margin-bottom: 2%;
}
#listWrap .puPainter::after{
 content: '';
 position: absolute;
}
#listWrap .puPainter::after{
 top: 0;
 right: 0;
 z-index: 2;
 border-width: 25px 20px;
 border-style: solid;
 border-color: transparent;
 border-right-color: #fff;
}
#listWrap h2{
 margin-bottom: .5em;
 padding: 0 .5em;
}
#listWrap .painterList h2{
 margin-bottom: 1em;
}
#listWrap .painterList.col{
 flex-grow: unset;
}
#listWrap .painterList ul li{
 font-size: 14px;
 padding-bottom: .5em;
 padding-left: 1.6em;
}
#listWrap .painterList li.comment::before{
 content: "\f075";
}
#listWrap .painterList li.phone::before{
 content: "\f095";
}
#listWrap .painterList li.fax::before{
 content: "\f1ac";
}
#listWrap .painterList li.envelope::before{
 content: "\f0e0";
}
#listWrap .painterList li.desktop{
 font-size: 13px;
 letter-spacing: 0;
}
#listWrap .painterList li.desktop::before{
 content: "\f108";
}
#listWrap .painterList li.circle::before{
 content: "\f05a";
}
/*高さ揃えのため追記　前田*/
#listWrap .row{
 display:-webkit-box;
 display:-moz-box;
 display:-ms-flexbox;
 display:-webkit-flex;
 display:-moz-flex;
 display:flex;
 -webkit-box-lines:multiple;
 -moz-box-lines:multiple;
 -webkit-flex-wrap:wrap;
 -moz-flex-wrap:wrap;
 -ms-flex-wrap:wrap;
 flex-wrap:wrap;
 }
@media print, screen and (min-width: 600px) {
#listWrap .painterList:nth-child(even){
 margin-left: 2%;
}
#listWrap .painterList:nth-child(odd){
 margin-left: 0;
}
}
@media print, screen and (min-width: 768px){
#listWrap .painterList:nth-child(even){
 margin-left: 2%;
}
#listWrap .painterList:nth-child(odd){
 margin-left: 0;
}
}
/* *******************************************************************　*/
/* バックナンバー ****************************************************　*/
/* *******************************************************************　*/
#archivesWrap .archivesContents .span_6{
 width: 48%;
 margin: 0 1%;
}
#archivesWrap .archivesContents .span_6:first-child,
#archivesWrap .archivesContents .span_6:nth-child(odd){
 margin-left: 0;
}
#archivesWrap .archivesContents .span_6 span.bookWrap{
 border: 1px solid #dedede;
 display: block;
 margin-bottom: 1em;
 padding: .5em .2em;
 text-align: center;
 letter-spacing: 0;
}
#archivesWrap .archivesContents .span_6 span.bookWrap span{
 font-family: 'Cinzel', serif;
}
#archivesWrap .archivesContents .span_6 a span.bookWrap span::before{

 content: "\f002\00a0";
 font-family: "FontAwesome";
}
#archivesWrap .archivesContents .span_6 a{
 display:block;
}
#archivesWrap .archivesContents .span_6 a:hover{
 background: #efefef;
 text-decoration: none;
}
#archivesWrap .archivesContents .span_6 img.archivesBook{
 margin: .2em .2em 0;
 width: 90%;
}
@media print, screen and (min-width: 600px) {
#archivesWrap .archivesContents .span_6{
 width: 23%;
 margin: 0 1%;
}
#archivesWrap .archivesContents .span_6:nth-child(odd){
 margin-left: 1%;
}
}
}
@media print, screen and (min-width: 768px){
#archivesWrap .archivesContents .span_6{
 width: 23%;
 margin: 0 1%;
}
#archivesWrap .archivesContents .span_6:nth-child(odd){
 margin-left: 1%;
}
}