@charset "utf-8";

@import url("//fonts.googleapis.com/css?family=Open+Sans:400,400italic,600,600italic,700,700italic");
@import url("//fonts.googleapis.com/css?family=Roboto+Slab:400,100,300,700");
@font-face {
font-family: 'icomoon';
src:url(//www.nplus-inc.co.jp/magazine/wp-content/themes/rewrite-media/fonts/icomoon.eot?-po9jho);
src:url(//www.nplus-inc.co.jp/magazine/wp-content/themes/rewrite-media/fonts/icomoon.eot?#iefix-po9jho) format('embedded-opentype'),
url(//www.nplus-inc.co.jp/magazine/wp-content/themes/rewrite-media/fonts/icomoon.woff?-po9jho) format('woff'),
url(//www.nplus-inc.co.jp/magazine/wp-content/themes/rewrite-media/fonts/icomoon.ttf?-po9jho) format('truetype'),
url(//www.nplus-inc.co.jp/magazine/wp-content/themes/rewrite-media/fonts/icomoon.svg?-po9jho#icomoon) format('svg');
font-weight: normal;
font-style: normal;
}  html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
margin:0;
padding:0;
border:0;
outline:0;
font-size:100%;
vertical-align:baseline;
background:transparent;
} body {
line-height:1;
} article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section {
display:block;
}  ol, ul {
list-style: none;
} blockquote, q {
quotes:none;
} blockquote:before, blockquote:after,
q:before, q:after {
content:'';
content:none;
} a {
margin:0;
padding:0;
font-size:100%;
vertical-align:baseline;
background:transparent;
} ins {
background-color:#ff9;
color:#000;
text-decoration:none;
} mark {
background-color:#ff9;
color:#000;
font-style:italic;
font-weight:bold;
} del {
text-decoration: line-through;
} abbr[title], dfn[title] {
border-bottom:1px dotted;
cursor:help;
} table {
border-collapse:collapse;
border-spacing:0;
} hr {
display:block;
height:1px;
border:0;  
border-top:1px solid #cccccc;
margin:1em 0;
padding:0;
} input, select {
vertical-align:middle;
} img {
vertical-align: top;
font-size: 0;
line-height: 0;
} *, *:before, *:after {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-o-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box;
}
.clearfix:after{
content: "."; 
display: block; 
height: 0; 
font-size:0;
clear: both; 
visibility:hidden;
}
.none{
display:none;
} body{
font-family: Helvetica, Arial, Verdana, Roboto, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro",  "游ゴシック" , "Yu Gothic" , "游ゴシック体" , "YuGothic" , Osaka, "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
@media all and (-ms-high-contrast:none){
body {
font-family: Helvetica, Arial, Verdana, Roboto , "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; }
}
.mincho{
font-family:"Roboto Slab" , Garamond , "Times New Roman" , "游明朝" , "Yu Mincho" , "游明朝体" , "YuMincho" , "ヒラギノ明朝 Pro W3" , "Hiragino Mincho Pro" , "HiraMinProN-W3" , "HGS明朝E" , "ＭＳ Ｐ明朝" , "MS PMincho" , serif;
}
a:hover{
opacity:0.7;
}
@media(max-width:1024px){
a:hover{
opacity:1;
}
}
.pc{
display:inherit;
}
.sp{
display:none;
}
@media(max-width:768px){
.pc{
display:none;
}
.sp{
display:inherit;
}
}  body{ background-color:#ffffff;
-webkit-text-size-adjust: 100%;
word-wrap : break-word;
overflow-wrap : break-word;
word-break: break-all;
}
body div#screen{ padding:0;
margin:0 auto;
position:relative;
}
@media(max-width:1200px){
body div#screen{
padding:0 10px;
}
}
@media(max-width:640px){
body div#screen{
padding:0 20px;
}
} .tags{
}
.tags .tag{
font-size:12px;
padding:6px 10px;
color:#555555;
background-color:#e6e6e6;
display: inline-block;
margin-right:4px;
margin-bottom:4px;
}
.tags .tag:last-child{
margin-right:0;
}
.tags .tag a{
color:#555555;
}  header{
width:100%; margin: 0 auto 40px auto;
padding:0;
}
header #logo{
text-align:center;
margin:60px auto 30px auto;
}
header #logo a{
text-decoration:none;
}
header #logo img{
max-width:448px;
}
header #nav{
height:70px;
}
header nav{
font-weight:bold;
text-align: center;
margin:0;
padding:0;
width:100%;
}
header nav.fixed{
position: fixed;
top: 0;
left: 0;
width: 100%;
z-index: 2;
text-align:center;
background-color:#ffffff;
}
header nav .inner{
background-image:url(//www.nplus-inc.co.jp/magazine/wp-content/themes/rewrite-media/images/beard.png),url(//www.nplus-inc.co.jp/magazine/wp-content/themes/rewrite-media/images/beard.png),url(//www.nplus-inc.co.jp/magazine/wp-content/themes/rewrite-media/images/beard.png),url(//www.nplus-inc.co.jp/magazine/wp-content/themes/rewrite-media/images/beard.png),url(//www.nplus-inc.co.jp/magazine/wp-content/themes/rewrite-media/images/navline.png),url(//www.nplus-inc.co.jp/magazine/wp-content/themes/rewrite-media/images/navline.png);
background-size:1px auto,1px auto,1px auto,1px auto , auto 1px ,auto 1px ;
background-repeat: no-repeat,no-repeat,no-repeat,no-repeat,repeat-x,repeat-x;
background-position:left top,left bottom,right top,right bottom,left top 2px ,left bottom 2px;
margin:0 auto;
max-width:1202px;
padding:3px 1px;
}
header nav.fixed .inner{
background-image:url(//www.nplus-inc.co.jp/magazine/wp-content/themes/rewrite-media/images/beard.png),url(//www.nplus-inc.co.jp/magazine/wp-content/themes/rewrite-media/images/beard.png),url(//www.nplus-inc.co.jp/magazine/wp-content/themes/rewrite-media/images/navline.png);
background-size:1px auto,1px auto ,auto 1px ;
background-repeat: no-repeat,no-repeat,repeat-x;
background-position:left bottom,right bottom,left bottom 2px;
padding:0 1px 3px 1px;
}
header nav ul{
width:100%; display: block;
}
header nav.fixed ul{
max-width:1200px;
}
header nav ul li{
line-height:1;
display:inline-block;
text-align:center; font-size:24px;
}
header nav ul li:last-child{ }
header nav ul li span{
display: block;
}
header nav ul li a{
text-decoration:none;
padding:20px;
display: block;
}
.english header nav ul li a{
padding:24px 15px 20px 15px;
}
header nav ul li span{
height:21px;
}
.english nav ul li img{
height:21px;
width:auto;
}
header nav ul li a:hover{
opacity:1;
}
@media(max-width:1200px){
header nav.fixed{
padding:0 10px;
}
}
@media(max-width:768px){
.english header nav ul li img{
height:18px;
}
}
@media(max-width:640px){
header #logo{
margin: 20px auto 25px auto;
}
header #logo img{
width:255px;
}
header #nav{
height:46px;
}
header nav.fixed{
padding:0 19px;
}
header nav ul li{
width:auto;
font-size:16px;
}
header nav ul li a{
padding:12px 10px;
}
header nav ul li img{
height:16px;
width:auto;
}
.english header #nav{
height:113.5px;
}
.english header nav ul{
width:243px;
padding:24px 0 0 0;
margin: 2px auto;
text-align: left;
z-index: -1;
}
.english header nav ul li a{
padding:0 25px 30px 0;
}
.english header nav ul li:nth-child(3) a,
.english header nav ul li:nth-child(4) a{
padding:0 2 5px 0 0;
}
.english header nav ul li span{
height:13.5px;
}
.english header nav ul li img{
height:13.5px;
width:auto;
}
}  #slider{
max-width:1200px;
margin: 0 auto;
padding: 0 0 60px 0;
}
#slider a{
text-decoration: none;
}
#slider article{
float:left;
max-width:300px;
width:calc(25% - 21px);
margin-right:28px;
}
#slider article:last-child{
margin-right:0;
}
#slider article figure{
background-position: center center;
background-size: cover;
background-repeat: no-repeat;
margin-bottom:16px;
position:relative;
}
#slider article figure:before{
position: absolute;
top:0;
left:0;
background-repeat: no-repeat;
background-position: left top;
background-size:40px auto;
content: "";
width:40px;
height:85px;
}
#slider article.know figure:before{
background-image: url(//www.nplus-inc.co.jp/magazine/wp-content/themes/rewrite-media/images/know_label_sp.png);
}
#slider article.fun figure:before{
background-image: url(//www.nplus-inc.co.jp/magazine/wp-content/themes/rewrite-media/images/fun_label_sp.png);
}
#slider article.connect figure:before{
background-image: url(//www.nplus-inc.co.jp/magazine/wp-content/themes/rewrite-media/images/connect_label_sp.png);
}
#slider article.live figure:before{
background-image: url(//www.nplus-inc.co.jp/magazine/wp-content/themes/rewrite-media/images/live_label_sp.png);
}
#slider article figure img{
width:100%;
}
#slider article div.date{
font-size:12px;
color:#999999;
margin-bottom:16px;
}
#slider article h1{
color:#000000;
font-size:20px;
font-weight:bold;
line-height:1.4;
height: 56px;
overflow:hidden;
margin-bottom:6px;
}
#slider article p{
font-size:14px;
color:#666666;
line-height:1.4;
height:58.8px;
overflow:hidden;
margin-bottom:14px;
}
@media(max-width:768px){
#slider article{
max-width:calc(50% - 24px);
width:calc(50% - 24px);
margin-right: 10px;
margin-left: 10px;
margin-bottom:30px;
display: inline-block;
vertical-align: top;
float:none;
}
}
@media(max-width:480px){
#slider{
padding: 10px 0 20px;
}
#slider article{
max-width:100%;
width:100%;
margin-left:0;
margin-right:0;
margin-bottom:30px;
}
#slider article h1{
margin-bottom: 10px;
height:auto;
}
}  #container{
max-width:960px;
margin:0 auto;
}
#main{
max-width:620px;
width:64.6%;
float:left;
}
#main h1{ font-size:24px;
position:relative;
margin-bottom:40px;
}
#main h1:before{
position: absolute;
top:0;
left:0;
}
#main h1 span.tit{
display:inline-block;
padding-right:20px;
}
#main h1 span.sub{
display:inline-block;
font-size:14px;
color:#666666;
padding-bottom:5px;
font-weight:normal;
}
#main a{
text-decoration:none;
color:#000000;
display:block;
}
#main a:hover{
opacity:0.7 !important;
}
#main article{
padding-bottom:32px;
}
#main article figure{
background-position: center center;
background-size: cover;
background-repeat: no-repeat;
margin-bottom:10px;
max-width:192px;
float:left;
}
#main article figure img{
width:100%;
}
#main article div.box{
margin-bottom:10px;
margin-left:18px;
float:left;
max-width:410px;
width:calc(100% - 210px);
}
#main article.article .tags{
width:100%;
max-width:100%;
}
#main article div.category{
color:#ffffff;
font-size:14px;
padding:1px 0;
text-align:center;
width:80px;
border-left:1px solid #000000;
border-right:1px solid #000000;
float: left;
margin-right:20px;
}
article div.category img.cateimg{
height:14px;
width:auto;
}
#main article div.date{
padding:2px 0;
font-size:12px;
color:#999999;
float:left;
}
.english #main article div.category{
width:109px;
padding:1px 0;
}
.english article div.category img.cateimg{
height:12px;
width:auto;
}
#main article h1{
padding-left:0;
color:#000000;
font-size:16px;
font-weight:bold;
line-height:1.4;
height: 44.8px;
height:auto;
overflow:hidden;
margin-bottom:10px;
float:right;
max-width:410px;
width:calc(100% - 210px);
}
#main article p{
font-size:14px;
color:#000000;
line-height:1.6;
height: 22.4px;
overflow:hidden;
margin-bottom:14px;
float:right;
max-width:410px;
width:calc(100% - 210px);
}
#main article .tags{
float:right;
max-width:410px;
width:calc(100% - 210px);
}
#main #pager{
font-size:16px;
margin-top:20px;
margin-bottom:80px;
text-align:center;
}
#main #pager a,
#main #pager span{
width:44px;
height:44px;
display:inline-block;
color:#999999;
padding-top:14px;
padding-bottom:14px;
}
#main #pager a:hover{
}
#main #pager a.arrow{
-moz-transform:    scale( 0.5, 1 ); -webkit-transform: scale( 0.5, 1 ); -o-transform:      scale( 0.5, 1 ); -ms-transform:     scale( 0.5, 1 ); transform:         scale( 0.5, 1 ); }
#main #pager a.current,
#main #pager span.current{
background-image:url(//www.nplus-inc.co.jp/magazine/wp-content/themes/rewrite-media/images/pager_active.png);
background-repeat: no-repeat;
background-position: center center;
color:#999999;
}
#main article .text a{
display:inline-block;
text-decoration:underline;
}
#main #pager a.prev img,
#main #pager a.next img{
width:auto;
height:13px;
}
@media(max-width:860px){
#main{
width:100%;
max-width:100%;
}
#main article div.box{
max-width:  100%;
}
#main article h1{
max-width: 100%;
}
#main article p{
max-width:100%;
}
#main article .tags{
max-width:inherit;
}
}
@media(max-width:640px){
#main{ }
#main article {
padding:20px 0;
border-top:1px solid #cccccc;
}
#main article:last-child{
border-bottom:1px solid #cccccc;
}
#main article figure{
width:125px;
height:107px;
background-size:cover;
}
#main article figure img{
width:125px;
height:107px;
}
#main article div.box{
width: calc(100% - 143px);
margin-left: 18px;
}
#main article div.category{
width:60px;
margin-right:10px;
}
.english #main article div.category{
width:109px;
padding:4px 0;
float: none;
}
.english article div.category img.cateimg{
height:12px;
width:auto;
}
.english #main article div.date{
padding:9px 0 0 0;
float:none;
}
#main article h1{
font-size:14px;
line-height:1.4;
height:58.8px;
width: calc(100% - 143px);
margin-left: 0;
}
#main article p{
float:none;
width:100%;
}
#main article .tags{
width:100%;
}
#main #pager{
margin:20px auto 50px auto;
}
#main #pager a.prev img,
#main #pager a.next img{
width:auto;
height:20px;
}
}
@media(max-width:370px){
#main h1 span.tit{
padding-right:4px;
}
#main h1 span.sub{
font-size:12px;
}
}  #sidemenu{
max-width:300px;
width:31.25%;
float:right;
}
#sidemenu #search{
max-width:300px;
margin-bottom:30px;
}
#sidemenu #search form{
max-width:300px;
position:relative;
}
#sidemenu #search form input#searchinput{
max-width:300px;
width:100%;
padding:7px 30px 7px 10px;
background-color: #eeeeee;
font-size:16px;
color:#999999;
border-radius:4px;
border:none;
}
#sidemenu #search form button#submit{
border:none;
position:absolute;
right:6px;
top:6px;
background-color:#eeeeee;
}
#sidemenu #ranking{
max-width:300px;
margin-bottom:30px;
}
#sidemenu #ranking h1{
color:#e83428;
font-size:20px;
margin-bottom:20px;
}
#sidemenu #ranking h1 span{
color:#666666;
font-size:14px;
display:inline-block;
vertical-align:top;
padding-left:10px;
}
#sidemenu #ranking a{
text-decoration: none;
display:block;
}
#sidemenu #ranking a:hover{
opacity: 0.7 !important;
}
#sidemenu #ranking article{  margin-bottom:20px;
position: relative;
}
#sidemenu #ranking article.rank:before{
position: absolute;
top:0;
left:0;
}
#sidemenu #ranking article.rank1:before{
content: url(//www.nplus-inc.co.jp/magazine/wp-content/themes/rewrite-media/images/rank_1.png);
}
#sidemenu #ranking article.rank2:before{
content: url(//www.nplus-inc.co.jp/magazine/wp-content/themes/rewrite-media/images/rank_2.png);    
}
#sidemenu #ranking article.rank3:before{
content: url(//www.nplus-inc.co.jp/magazine/wp-content/themes/rewrite-media/images/rank_3.png);
}
#sidemenu #ranking article.rank4:before{ }
#sidemenu #ranking article.rank5:before{ }
#sidemenu #ranking article figure{
max-width:74px;
background-position: center center;
background-size: cover;
background-repeat: no-repeat;
float:left;
}
#sidemenu #ranking article figure img{
width:100%;
}
#sidemenu #ranking article div.date{
font-size:10px;
color:#999999;
margin-bottom:10px;
}
#sidemenu #ranking article h1{
color:#000000;
font-size:14px;
font-weight:bold;
line-height:1.6;
height: 67.2px;
overflow:hidden;
padding-left:10px;
margin-bottom:0;
font-weight:normal;
}
#sidemenu #banner{
max-width:300px;
margin-bottom:30px;
} 
#sidemenu #banner a:hover{
opacity: 0.7 !important;
}
#sidemenu #banner a img{
width:100%;
margin-bottom:20px; 
} 
@media(max-width:860px){
#sidemenu{
max-width:100%;
width:100%;
}
#sidemenu #search{
margin:0 auto 30px auto;
}
#sidemenu #search{
max-width:inherit;
width:100%;
}
#sidemenu #search form{
max-width:inherit;
width:100%;
}
#sidemenu #search form input#searchinput{
max-width:inherit;
width:100%;
}
#sidemenu #ranking{
width:100%;
max-width:600px;
margin:0 auto 30px auto;
}
#sidemenu #banner{
max-width:300px;
width:100%;
margin:0 auto 30px auto;
} 
}
@media(max-width:640px){
#sidemenu #ranking article h1{
font-size:14px;
line-height: 1.4;
height:78.4px;
}
}  #main article.article{
max-width:620px;
}
#main article.article figure{
background-position: center center;
background-size: cover;
background-repeat: no-repeat;
margin-bottom:30px;
max-width:620px;
float:left;
}
#main article.article figure img{
width:100%;
}
#main article.article div.box2{
margin-bottom:24px;
position:relative;
}
#main article.article div.box2 div.sns{
float:right;
}
#main article.article div.box2 div.sns div.snsshare{
float:left;
margin-left:10px;
}
#main article.article div.category{
color:#000000;
font-weight:bold;
font-size:14px;
padding: 0;
text-align:center;
width:80px; float: left;
margin:0 20px 16px 0;
}
.english #main article.article div.category{
width:109px;
}
#main article.article div.date{
padding:2px 0;
font-size:12px;
color:#999999;
float:left;
margin:0 0 16px 0;
}
#main article.article  .tags{
float:left;
}
#main article.article h1{
padding-left: 0;
font-size: 26px;
position: relative;
margin-bottom: 40px;
line-height:1.6;
float: none;
max-width: inherit;
width: auto;;
height: auto;
}
.author{
padding:30px 0;
margin:0 0 30px 0;
border-bottom:1px solid #cccccc;
}
.author .fig{
width:80px;
float:left;
border:1px solid #cccccc;
}
.author .fig img{
width:100%;
height:auto;
}
.author .txt{
width: calc(100% - 80px);
float:right;
padding:0 0 0 20px;
}
.author .txt .name{
font-size:14px;
font-weight:bold;
margin:0 0 10px 0;
float:left;
}
.author .txt .name span{
font-size:12px;
padding:1px 0;
}
.author .txt .link{
float:right;
}
.author .txt .link a{
font-size:12px;
color:#666666;
text-decoration: underline !important;
}
.author .txt .desc{
font-size:12px;
line-height:1.7;
color:#565656;
}
.author.authorlist{
margin:0 auto;
} #main article.article div.text{
margin-bottom:30px;
line-height:1.4;
}
#main article.article div.text h1{
font-size:24px;
margin-bottom:4px;
}#main article.article div.text h2{
font-size:20px;
margin-bottom:4px;
}
#main article.article div.text h3{
font-size:18px;
margin-bottom:4px;
}
#main article.article div.text h4{
font-size:16px;
margin-bottom:4px;
}
#main article.article div.text h5{
font-size:15px;
margin-bottom:4px;
}
#main article.article div.text h6{
font-size:14px;
margin-bottom:4px;
}
#main article.article div.text p{
line-height:1.8;
padding:8px 0;
float:none;
max-width: inherit;
width: auto;;
height: auto;
overflow: inherit;
margin-bottom: 14px;
}
#main article.article div.text p.has-small-font-size{
font-size:13px;
}
#main article.article div.text p.has-medium-font-size{
font-size:20px;
}
#main article.article div.text p.has-large-font-size{
font-size:36px;
}
#main article.article div.text p.has-huge-font-size{
font-size:48px;
}
#main article.article div.text strong{
font-weight:bold;
}
#main article.article div.text em{
font-style:italic;
}
#main article.article div.text  .wp-block-quote{
border-left: 4px solid #000;
padding:2px 0 8px 1em;
}
#main article.article div.text  .wp-block-quote p{
margin-bottom:4px;
}
#main article.article div.text  .wp-block-quote cite{
font-size:12px;
}
#main article.article div.text ul{
margin-bottom: 14px;
padding-left: 1em;
}
#main article.article div.text ul li{
list-style: circle;
}
#main article.article div.text ol{
margin-bottom: 14px;
padding-left: 1em;
}
#main article.article div.text ol li{
list-style: decimal;
}
#main article.article div.text ul li.blocks-gallery-item{
list-style: none;
}
#main article.article div.text figure{
background-position: center center;
background-size: cover;
background-repeat: no-repeat; margin:0 auto 30px auto;
max-width: 620px;
width:100%;
height:auto;
float: none;
}
#main article.article div.text p.wp-caption-text{
font-size:80%;
padding: 2px 0 8px 0;
}
#main article.article div.text div.wp-caption{
width:auto !important;
}
#main article.article div.text figure img{
max-width:max-content;
width:100%;
height:auto;
display:block;
margin:0 auto;
}
#main article.article div.text .wp-block-table{
width:100%;
}
#main article.article div.text .wp-block-table th,
#main article.article div.text .wp-block-table td
{
border:1px solid #cccccc;
padding:6px;
}
#main article.article div.text .wp-block-embed{
width:auto;
height:auto;
}
#main article.article div.text .wp-block-embed iframe{
width:calc(100% - 20px);
}
#main article.article div.text .wp-block-embed:after{
content: "."; 
display: block; 
height: 0; 
font-size:0;
clear: both; 
visibility:hidden;
} #main article.article #pagenavi{
width:100%;
padding:10px 0 60px;
}
#main article.article #pagenavi a{
display:inline;
font-size:14px;
font-weight:bold;
}
#main article.article #pagenavi .prev{
float:left;
padding-bottom: 10px;
border-bottom: 2px solid #000000;
color:#000000;
}
#main article.article #pagenavi .next{
float:right;
padding-bottom: 10px;
border-bottom: 2px solid #000000;
color:#000000;
}
#main article.article #pagenavi .prev:hover,
#main article.article #pagenavi .next:hover
{
border-bottom: 2px solid #e83428;
border-bottom: 2px solid #e83428;
}
#main article.article #pagenavi .prev:hover a,
#main article.article #pagenavi .next:hover a
{
opacity:1 !important;;
color:#e83428;
}
#main article.article #bottomsns{
margin-bottom:60px;
background-color:#e83428;
}
#main article.article #bottomsns figure{
background-position: center center;
background-size: cover;
background-repeat: no-repeat;
margin-bottom:0;
border-radius:0;
max-width:320px;
float:left;
}
#main article.article #bottomsns figure img{
width:100%;
}
#main article.article #bottomsns .comment{
color:#ffffff;
font-size:14px;
text-align:center;
padding-top:50px;
margin-bottom:30px;
}
#main article.article #bottomsns .sns{
text-align:center;
}
#main article.article #bottomsns .sns .snsshare{
display:inline-block;
margin-left:10px;
}
#main article.article #recommend{
padding-bottom:20px;
max-width:100%;
}
#main article.article #recommend h1{
color:#e83428;
margin-bottom: 20px;
float:none;
max-width: inherit;
width:auto;
}
#main article.article #recommend h1 img{
display:inline-block;
vertical-align: top;
padding: 4px 0 0 0;
}
#main article.article #recommend h1 span{
color:#999999;
display:inline-block;
vertical-align: top;
padding:0 0 0 20px;
font-size:14px;
}
#main article.article #recommend a {
width:calc( 100% / 3 - 19px);
padding:0;
float:left;
margin-right:28px;
}
#main article.article #recommend a:last-child{
margin-right:0;
}
#main article.article #recommend article{
}
#main article.article #recommend article figure{
margin-bottom: 10px;
float:none;
}
#main article.article #recommend article figure img{
}
#main article.article #recommend article .box{
margin-left: 0;
margin-bottom: 0;
width:100%;
}
#main article.article #recommend article h1{
font-size:14px;
line-height: 1.6;
height: 44.8px;
color:#000000;
float:none;
max-width: 100%;
width:100%;
}
@media(max-width:860px){
#main article.article{
max-width:100%;
width:100%;
margin:0 auto 30px auto;
overflow:hidden;
}
#main article.article figure{
max-width:100%;
width:100%;
}
}
@media(max-width:640px){ #main article.article{
border:none;
}
#main article.article div.box2{
margin-bottom: 14px;
}
#main article.article div.box2 div.sns{
margin: 0 0 16px 0;
}
#main article.article div.category{
margin: 0 10px 10px 0;
width:70px;
}
#main article.article figure{
width:100%;
height:156px;
}
#main article.article figure img{
width:100%;
height:156px;
}
#main article.article .tags{
width:100%;
max-width:100%;
}
#main article.article h1{
font-size:20px;
line-height:1.4;
height:auto;
max-height:inherit;
overflow:visible;
}
.author .fig{
margin:0 0 15px 0;
}
.author:first-child{
border-top: 1px solid #cccccc;
}
.author .txt .name{
float:none;
margin: 0 0 20px 0;
line-height:1.4;
}
.author .txt .name span{
display:block;
}
.author .txt .link{
float:none;
}
.author .txt.txt2{
width:100%;
padding:0;
}
#main article.article #recommend{
padding:30px 0;
}
#main article.article:last-child #recommend{
}
#main article.article #recommend a{
width:100%;
padding:20px 0;
border-top:1px solid #cccccc;
margin-right:0;
}
#main article.article #recommend a:last-child{
border-bottom:1px solid #cccccc;
}
#main article.article #recommend article{
border:none;
padding:0;
}
#main article.article #recommend a article figure{
width:125px;
height:108px;
float:left;
margin:0;
}
#main article.article #recommend a article figure img{
width:125px;
height:108px;
}
#main article.article #recommend div.box{
width: calc(100% - 143px);
margin-left: 18px;
}
#main article.article #recommend div.category{
width:60px;
margin: 0 10px 10px 0;
}
#main article.article div.date{
margin:0;
}
#main article.article #recommend article h1{
font-size: 14px;
line-height: 1.4;
height: 78.4px;
width: calc(100% - 143px);
margin-left: 18px;
float: right;
margin-bottom:0;
}
#main article.article #recommend p{
float:none;
width:100%;
}
#main article.article #recommend .tags{
width:100%;
}
#main article.article #bottomsns .comment{
padding-top:15px;
}
}
@media(max-width:480px){
#main article.article #bottomsns figure{
max-width:150px;
}
#main article.article #bottomsns .comment{
padding-top: 30px;
margin-bottom:5px;
}
}  .recipe figure{
text-align:center;
float:none !important;
}
.recipe figure img{ width:100% !important; height: auto !important;
float: left !important;
}
.recipe p{ padding-left:0 !important;
}
.recipe #zairyou{
clear: both !important;
padding: 20px 0 30px !important;
}
.recipe #zairyou table{
width: 100% !important;
border-collapse: collapse !important;
}
.recipe #zairyou table caption{
text-align: left !important;
border-bottom: 1px solid #C9BB8B !important;
font-size: 15px !important;
}
.recipe #zairyou table caption span{
font-size: 12px !important;
font-family: "ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","Meiryo","メイリオ","ＭＳ Ｐゴシック",Helvetica,Arial,sans-serif !important;
}
.recipe #zairyou table td{
border-bottom: 1px solid #C9BB8B !important;
padding: 5px 0 !important;
}
.recipe #zairyou table td.bunryou{
text-align: right !important;
}
.tsukurikata{
margin-bottom: 15px !important;
}
.tsukurikata figure img{
width:144px !important;
height: auto !important;
float: left !important;
}
.tsukurikata p{
padding-left: 154px !important;
}
.point{
clear: both !important;
margin: 30px 0 20px !important;
padding: 10px 0 !important;
border-top: 1px solid #C9BB8B !important;
border-bottom: 1px solid #C9BB8B !important;
}
.point b{
margin-bottom: 8px !important;
display: block !important;
}
@media screen and (min-width: 768px) {
.recipe figure{
float:left !important;
width:auto !important;
}
.recipe figure img{
width:344px !important;
}
.recipe p{
padding-left: 384px !important;
}
.recipe #zairyou{
padding-left: 384px !important;
clear: none !important;
margin: 40px 0 !important;
}
.recipe #zairyou table caption{
font-size: 20px !important;
}
.recipe #zairyou table caption span{
font-size: 14px !important;
}
.recipe #zairyou table td{
border-bottom: 1px solid #C9BB8B !important;
padding: 10px 0 !important;
}
.tsukurikata{
margin-bottom: 40px !important;
}
.tsukurikata figure img{
width:300px !important;
}
.tsukurikata p{
padding-left: 340px !important;
}
.point{
margin: 60px 0 40px !important;
padding: 12px 0 !important;
}
.point b{
margin-bottom: 10px !important;
}
}  .YoutubeWrapper{
position: relative ;
margin-top: 1.2em ;
margin-bottom: 1.2em ;
padding-top: 69px ;
padding-bottom: 50% ;
overflow: hidden ;
}
.YoutubeWrapper iframe {
position: absolute ;
top: 0 ;
left: 0 ;
height: 100% ;
width: 100% ;
}  footer{ width:100%;
border-top:1px solid #999999;
padding:40px 0 20px;
margin:0 auto;
position: relative;
background-color:#ffffff;
}
footer nav{
text-align:center;
}
footer nav ul{
padding-bottom:30px;
}
footer nav ul li{
display:inline-block;
margin-right:10px;
margin-left:10px;
}
footer nav ul li:last-child{
margin-right:0;   
}
footer nav ul li a{
color:#999999;
text-decoration: none;
font-size:14px;
}
footer nav ul li a:hover{
opacity:1 !important;
color:#e83428;
}
footer #copyright{
font-size:10px;
color:#999999;
text-align:center;
letter-spacing: 1px;
}
#gotop{
max-width:1200px;
width:100%;
margin:0 auto;
position: relative;
}
#gotop img{
position: absolute;
right:10px;
bottom:20px;
}
#gotop img:hover{
opacity:0.7 !important;
cursor: pointer;
}
@media screen and (max-width: 768px) {
#gotop img{
position: static;
margin: 0 auto 10px auto;
display: block;
}
}
@media(max-width:640px){
footer nav ul li{
margin-bottom:10px;
}
footer nav ul li a{
font-size:12px;
}
} section#main article.page h1{
padding-top:40px;
} section#main article dl#kyoukaigaiyou{
border-top:1px solid #999999;
padding-top:15px;
line-height:1.2;
}
section#main article dl#kyoukaigaiyou dt{
width: 80px;
float: left;
margin-right: 10px;
padding-bottom:15px;
}
section#main article dl#kyoukaigaiyou dd{
padding-left: 90px;
margin-bottom: 1em;
border-bottom:1px solid #999999;
padding-bottom:15px;
}
section#main article dl#kyoukaigaiyou dd a{
color:#bb9a14;
text-decoration:underline;
}  section#main #contactform dl dt {
padding:20px 0 0;
}
section#main #contactform dl dt span.req{
background-color:#ff0000;
color:#ffffff;
font-size:70%;
padding:2px;
}
section#main #contactform dl dd input{
font-size:16px;
height:20px;
border: 1px solid #ddcc89;
width:100%;
}
section#main #contactform dl dd textarea{
font-size:16px;
height:160px;
border: 1px solid #ddcc89;
width:100%;
}
section#main #contactform p.submit{
text-align:center;
}
section#main #contactform input#formsubmit{
border: 2px solid #ddcc89;
padding: 5px 0;
margin: 0 auto;
width: 300px;
display: inline-block;
font-size:16px;
color:#93781E;
background-color:inherit;
text-align:center;
}
section#main #contactform input#formsubmit:hover{
border: 2px solid #ddcc89;
padding: 5px 0;
margin: 0 auto;
width: 300px;
font-size:16px;
color:#000000;
background-color:#ddcc89;
text-align:center;
}
div.wpcf7-mail-sent-ok {
border: 2px solid #ddcc89 !important ;
}  section#main article#privacy{
padding-top:15px;
line-height:1.2;
}
section#main article#privacy p{
line-height: 1.8;
padding: 8px 0;
}
section#main article#privacy dl{
line-height: 1.8;
padding:10px 0;	
}
section#main article#privacy  dt{
font-weight:bold;
}
section#main article#privacy  dl ul {
padding-left:10px;
}
section#main article#privacy  dl ul li{
list-style-type: disc;
}
section#main article#privacy  a{
text-decoration: underline;
display:inline;
}