@charset "utf-8";
/* ===================================================================
CSS information
file name : index.css
=================================================================== */

@media screen and (max-width:767px) {

  /*font*/
  .italic { font-style:italic; font-weight: bold; font-size:14px; display:block; margin-top: 10px;}
  .bold_l { font-size:24px; line-height:1.2; font-weight: bold; display:block; margin-bottom: 3px; }
  .bold_lm { font-size:32px; line-height:1.2; font-weight: bold; display:block; margin-bottom: 3px; }
  .bold_m { font-size:20px; line-height:1.2; font-weight: bold; display:block; margin-bottom: 3px; }
  .bold_s {  font-size:18px; line-height:1.2; font-weight: bold; display:block; margin-bottom: 3px; }
  .small { font-size:14px; display:block; font-weight: normal; }
  .small_b { font-size:14px; display:block; font-weight: bold; }
  
  /*margin*/
  .margin_u5 {margin-bottom:5px;}
  .margin_u10 {margin-bottom:10px;}
  .margin_u15 {margin-bottom:15px;}

  /* pickup */
  #pickup { background-color:#FFF; padding-bottom:30px; }
  #pickup .inner { padding:15px 0 0; }
  #pickup #top_banner { margin-bottom:15px;width:100%;border: 1px #000 solid;}
  
  
    /* top_main */
  .top_main { display:inline-block; border-bottom:1px solid #d6d6d6; padding-bottom:15px; margin-bottom:10px;}
  .top_main img { width:90%; margin:0 auto 10px auto; }
  
  
    /* top_sub */
  .top_sub {display:inline-block;border-bottom:1px solid #d6d6d6; padding-bottom:15px;padding-top:15px;}
  .top_sub img { width:90%;margin:0 auto 10px auto;}
  
  
    /*cat_title*/
  .cat_title { color:#FFF;background-color:#000;padding:13px 0 13px 13px;font-size:16px; margin-bottom:10px;}
  
  
    /*cat article */
  .cat_article {display:inline-block; width:100%; padding-bottom:5px;padding-top:15px;}
  .cat_article_box {border-bottom:1px solid #cc0000;}
  .cat_article_title {display:inline-block; color:#cc0000; font-size:16px;font-weight: bold;}
  .cat_article_title_r {display:inline-block; color:#000; font-size:12px; text-align:right;margin-right: 17px; float:right;}
  .cat_article_title_r.arrow{
  position: relative;
  display: inline-block;
  padding-left: 18px;
  }
  .cat_article_title_r.arrow::after{
  content: '';
  width: 6px;
  height: 6px;
  border: 0px;
  border-top: solid 2px #cc0000;
  border-right: solid 2px #cc0000;
  -ms-transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  position: absolute;
  top: 50%;
  left: 155px;
  margin-top: -4px;
  }
  .cat_article_title_s {display:inline-block; margin-top:7px;}
  
  
   /* lineup */
  #lineup { background-color:#f5f5f5; position:relative;margin-top:30px; padding-top:20px;padding-bottom:10px; }
  .lineup_title { display: inline-block;font-size:18px; font-family:'Noto Sans JP'; font-weight:900;width: 100%; text-align:center; margin-bottom:10px; }
  .lineup_titleline{border-left:4px solid #000;border-right:4px solid #000; padding-left:15px; padding-right:30px;}
  .lineup_inner ul{display: inline-block; margin:0 15px; padding-left:20px;}
  .lineup_inner ul li{padding:5px 0;display: list-item;list-style: disc;marker-offset:5px;}
  
  
    /* right Latest issue */
  .latest_issue { width:100%; border:1px solid #000; margin-top:20px; margin-bottom:20px;}
  .latest_issue img { width:100%;}
  .latest_issue_area { width:100%; margin:13px auto 35px auto;}
  .latest_issue_area .icon { background-color:#e60012; font-size:12px; float:left; padding:0 8px; margin:4px 5px 0 0; }
  .latest_issue_area .date { font-weight:bold; font-size:12px;letter-spacing: -1px; margin-top:12px; margin-bottom:10px; }
  .latest_issue_area .date span { font-size:15px; }
  .latest_issue_area ul{ display:inline-block;font-size:12px;}
  .latest_issue_area ul li{display: list-item;list-style: disc;margin-left: 15px;}
  .latest_issue_area .btn_latest { clear:both; padding-top:10px; }
  .latest_issue_area .btn_latest a { display:block; border:1px solid #fff; background-color:#000; color:#fff; text-align:center; padding:5px 0; }
  .latest_issue_area .btn_latest a span { position:relative; padding-left:15px; }
  .latest_issue_area .btn_buy { clear:both; padding-top:10px; }
  .latest_issue_area .btn_buy a { display:block; border:1px solid #fff; background-color:#cc0000; color:#fff; text-align:center; padding:5px 0; }
  .latest_issue_area .btn_buy a span { position:relative; padding-left:15px; }
  .latest_issue_area a span::after{
  content: '';
  width: 6px;
  height: 6px;
  border: 0px;
  border-top: solid 2px #FFF;
  border-right: solid 2px #FFF;
  -ms-transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  position: absolute;
  top: 50%;
  left: 145px;
  margin-top: -4px;
  }
  
  
  /*baner*/
  .baner img { width:100%; margin-bottom:10px;border: 1px #cccccc solid;}
  
  
    /*info*/
  
  .info { margin-top:30px;}
  .info_title {font-size:18px; font-weight:bold; border-bottom: 3px #000 solid;}
  .info_area {margin-top:13px; padding-bottom:15px; border-bottom: 1px #666 solid;}
  .info_date {font-size:12px; color:#666666;}
  .info_sub {margin-top:5px;}
  


  /* snsArea */
  #snsArea { padding:10px 0 30px; }
  #snsArea .inner { overflow:hidden; }
  #snsArea .facebook { margin-bottom:10px; height:300px;overflow:hidden;}
  #snsArea .twitter { height:300px; margin-bottom:10px;overflow:hidden; }

}
@media screen and (min-width:768px) {
	
  /*font*/
  .italic { font-style:italic; font-weight: bold; font-size:14px; display:block; margin-top: 10px;}
  .bold_l { font-size:24px; line-height:1.2; font-weight: bold; display:block; margin-bottom: 3px; }
  .bold_lm { font-size:32px; line-height:1.2; font-weight: bold; display:block; margin-bottom: 3px; }
  .bold_m { font-size:20px; line-height:1.2; font-weight: bold; display:block; margin-bottom: 3px;  }
  .bold_s {  font-size:18px; line-height:1.2; font-weight: bold; display:block; margin-bottom: 3px; }
  .small { font-size:14px; display:block; font-weight: normal; }
  .small_b { font-size:14px; display:block; font-weight: bold; }
	
 /* left_content */
  #left_content { color:#000; background-color:#fff; width:700px; margin-top:20px;margin-bottom:10px;margin-right:30px; float:left;}
 /* right_content */
  #right_content { color:#000; background-color:#fff; width:250px; margin-top:20px;margin-bottom:10px; float:left;}
  
  /* top_main */
  .top_main { display:inline-block; border-bottom:1px solid #d6d6d6; padding-bottom:15px; margin-bottom:10px;}
  .top_main img { width:150px; float:left; margin-right:15px;height: 150px;object-fit: cover;object-position: 0% 0%;}
  .top_main_box { width:535px;float:left;}
  
  
  /* top_sub */
  .top_sub {display:inline-block;border-bottom:1px solid #d6d6d6; padding-bottom:15px;padding-top:15px;}
  .top_sub:nth-child(even){ margin-right:24px;}
  .top_sub img { width:80px; float:left; margin-right:10px;object-fit: cover;object-position: 0% 0%;height: 80px;}
  .top_sub_box { width:245px;float:left;}
  
  
  /*cat_title*/
  .cat_title { color:#FFF;background-color:#000;padding:13px 0 13px 13px;font-size:16px; margin-bottom:10px;}
  
  /*cat article */
  .cat_article {display:inline-block; width:340px; padding-bottom:5px;padding-top:15px;}
  .cat_article_box { width:340px;border-bottom:1px solid #cc0000;}
  .cat_article_title {display:inline-block; color:#cc0000; font-size:16px;font-weight: bold;}
  .cat_article_title_r {display:inline-block; color:#000; font-size:12px; text-align:right;margin-right: 17px; float:right;}
  .cat_article_title_r.arrow{
  position: relative;
  display: inline-block;
  padding-left: 18px;
  }
  .cat_article_title_r.arrow::after{
  content: '';
  width: 6px;
  height: 6px;
  border: 0px;
  border-top: solid 2px #cc0000;
  border-right: solid 2px #cc0000;
  -ms-transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  position: absolute;
  top: 50%;
  left: 155px;
  margin-top: -4px;
  }
  .cat_article:nth-child(odd){ margin-right:12px;}
  .cat_article_title_s {display:inline-block; width:340px; margin-top:7px;}
  
    /* lineup */
  #lineup { background-color:#f5f5f5; position:relative;margin-top:30px; padding-top:20px;padding-bottom:10px; }
  .lineup_title { display: inline-block;font-size:18px; font-family:'Noto Sans JP'; font-weight:900;width: 100%; text-align:center; margin-bottom:10px; }
  .lineup_titleline{border-left:4px solid #000;border-right:4px solid #000; padding-left:15px; padding-right:30px;}
  .lineup_inner ul{display: inline-block;width:670px; margin:0 15px; padding-left:20px;}
  .lineup_inner ul li{width:49%;padding:5px 0;display: list-item;list-style: disc;marker-offset:5px;}
  .lineup_inner ul li:nth-child(even){float:left;}
  .lineup_inner ul li:nth-child(odd){float:left;clear:left;}
  .lineup_inner ul li a{text-decoration: underline;}
  

  
  /* right Latest issue */
  .latest_issue { width:248px;border:1px solid #000; margin-bottom:20px;}
  .latest_title { width:248px;}
  .latest_main {width:220px;}
  .latest_issue_area { width:220px; margin:13px auto 35px auto;}
  
    .latest_issue_area .bold_s { display: initial; margin: initial; font-size: initial; font-weight: initial; line-height: initial;font-size:12px;}
  .latest_issue_area .bold_l { display: initial; margin: initial; font-size: initial; font-weight: initial; line-height: initial;font-size:12px;}
  .latest_issue_area .bold_ss  {  display: initial;margin: initial; font-size: initial; font-weight: initial; line-height: initial;font-size:12px;}
  .latest_issue_area .bold_m {  display: initial;margin: initial; font-size: initial; font-weight: initial; line-height: initial;font-size:12px;}
    .latest_issue_area .box{letter-spacing:-1px; margin-right:-3px; padding-bottom:5px;}
  .latest_issue_area .box:before {content: '・';}
  
  
  .latest_issue_area .icon { background-color:#e60012; font-size:12px; float:left; padding:0 8px; margin:4px 5px 0 0; }
  .latest_issue_area .date { font-weight:bold; font-size:12px;letter-spacing: 0px; margin-top:12px; margin-bottom:10px; }
  .latest_issue_area .date span { font-size:15px; }
  .latest_issue_area ul{ display:inline-block;font-size:12px;}
  .latest_issue_area ul li{display: list-item;list-style: disc;margin-left: 15px;}
  .latest_issue_area .btn_latest { clear:both; padding-top:10px; }
  .latest_issue_area .btn_latest a { display:block; border:1px solid #fff; background-color:#000; color:#fff; text-align:center; padding:5px 0; }
  .latest_issue_area .btn_latest a span { position:relative; padding-left:15px; }
  .latest_issue_area .btn_buy { clear:both; padding-top:10px; }
  .latest_issue_area .btn_buy a { display:block; border:1px solid #fff; background-color:#cc0000; color:#fff; text-align:center; padding:5px 0; }
  .latest_issue_area .btn_buy a span { position:relative; padding-left:15px; }
  .latest_issue_area a span::after{
  content: '';
  width: 6px;
  height: 6px;
  border: 0px;
  border-top: solid 2px #FFF;
  border-right: solid 2px #FFF;
  -ms-transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  position: absolute;
  top: 50%;
  left: 145px;
  margin-top: -4px;
  }
  
  
  /*baner*/
  .baner img { margin-bottom:10px;border: 1px #cccccc solid;}
  
  
  
  /*info*/
  
  .info {width:250px; margin-top:100px;}
  .info_title {width:250px;font-size:14px; font-weight:bold; border-bottom: 3px #000 solid;}
  .info_area {margin-top:13px; padding-bottom:15px; border-bottom: 1px #666 solid;}
  .info_date {font-size:12px; color:#666666;}
  .info_sub {margin-top:5px;}
  
	
  /* pickup */;
  #pickup { background-color:#fff; position:relative; }
  #pickup .inner { overflow:hidden; padding:10px 0 0; color:#fff; }
  #pickup #top_banner { margin-bottom:20px;width:99%;border: 1px #000 solid;}


  /* snsArea */
  #snsArea { margin-top:30px; padding:10px 0 20px; width:700px; height:400px; float:left; overflow:hidden; }
  #snsArea .inner { overflow:hidden; width:700px; }
  #snsArea .facebook { float:right; width:335px;border:1px solid #000; }
  #snsArea .twitter { float:left; width:335px; border:1px solid #000; }

}

.facebook > .fb-page {
width: 100%;
}
.facebook > .fb-page > span,
.facebook iframe {
width: 100% !important;
}