@charset "UTF-8";
@-ms-viewport {width: device-width;}
body {
    color: #333;
    font-family: Avenir , "Open Sans" , "Helvetica Neue" , Helvetica , Arial , Verdana , Roboto , "ヒラギノ角ゴ Pro W3" , "Hiragino Kaku Gothic Pro" , "Meiryo UI" , "メイリオ" , Meiryo , "ＭＳ Ｐゴシック" , "MS PGothic" , sans-serif;
    font-size: 14px;
    line-height: 1.6;
    text-align: justify;}
h1, h2, h3, h4, h5, h6{
    font-size: 14px;
    font-weight: normal;
    margin: 0 auto;
    padding: 0;
    line-height: 1.2;}
ul,ol {
    margin: 0;
    padding: 0;
    list-style: none;}
a, a:link, a:active, a:visited {
    color: #333;
    outline: none;
    text-decoration: none;
    display: inline-block;
    transition: background-color 0.5s ease;
    -webkit-transition: background-color 0.5s ease;
    -moz-transition: background-color 0.5s ease;}
a:hover {
  opacity: 0.8;
  filter: alpha(opacity=80);
  -moz-opacity: 0.8;
  -webkit-transition: 0.3s ease-in-out;
  -moz-transition: 0.3s ease-in-out;
  -o-transition: 0.3s ease-in-out;
  transition: 0.3s ease-in-out;
}
.serif{
    font-family:"Roboto Slab" , Garamond , "Times New Roman" , "游明朝" , "Yu Mincho" , "游明朝体" , "YuMincho" , "ヒラギノ明朝 Pro W3" , "Hiragino Mincho Pro" , "HiraMinProN-W3" , "HGS明朝E" , "ＭＳ Ｐ明朝" , "MS PMincho" , serif;}
.pk1{
    color: #fd4a5b;}
.pk2{
    color: #ff9a9a;}
.or{
    color: #ffa239;}
.ye{
    color: #f9b93e;}
.inner{
    margin: 0 auto;
    width: 1000px;}
.midashi {
    font-size: 120%;
    font-weight: bold;
    margin-bottom: 5px;
}
/*clearfix
---------------------------------*/
/* For modern browsers */
.cf:before,
.cf:after {
    content: " ";
    display: table;}
.cf:after {
    clear: both;}
/* For IE 6/7 only */
.cf {
    *zoom: 1;}
/*headr
---------------------------------*/
#head{
    box-shadow: 0px 5px 3px -4px rgba(92, 0, 0, .4);
  -webkit-box-shadow: 0px 5px 3px -4px rgba(92, 0, 0, .4);
  -moz-box-shadow: 0px 5px 3px -4px rgba(92, 0, 0, .4);
    padding: 20px;
    text-align: center;
    position: relative;
    z-index: 1;}
.sitettl h1 a,.sitettl p a{
    color: #7b5749;
    font-size: 33px;
    line-height: 1.2}
.sitettl .wh{
    padding: 10px;
    color: #fff;
    background: url(../images/logo_bk.png) no-repeat;}
.sitettl .pk1,.sitettl .pk2,.sitettl .or,.sitettl .ye{
    font-size: 42px}
#mainvisual{
    padding: 20px 0 0 0;
    background: url(../images/mainv_bk.jpg) no-repeat;
    background-size: cover;}
#mainvisual .inner{
    background: url(../images/main_img2.png) right bottom no-repeat;
    }
#mainvisual img{
    margin-top: -40px}
.catch{
    border-radius: 5px;
    line-height: 1.2;
    box-shadow: 0 0 6px rgba(92, 0, 0, .4);
  -webkit-box-shadow: 0 0 6px rgba(92, 0, 0, .4);
  -moz-box-shadow: 0 0 6px rgba(92, 0, 0, .4);
    padding: 20px 60px 25px;
    border: 10px solid #fff;
    display: inline-block;
    font-size: 46px;
    background: url(../images/catch_bk.jpg) repeat;}
.catch h1{
    font-size: 46px;}
.catch small{
    font-size: 32px;}
.catch .big{
    font-weight: bold;
    font-size: 70px;}
/*#wrap
---------------------------------*/
#wrap,#sub_wrap{
    width: 1000px;
    padding: 30px 0 60px;
    margin:  0 auto;}
main{
    width: 680px;
    float: left;}
side{
    width: 300px;
    float: right;}
/*main
---------------------------------*/
#rank{
    margin-bottom: 20px;}
#rank .title{
    color: #fff;
    background: url(../images/rank_ttl.png) no-repeat;
    font-size: 30px;
    padding: 10px 10px 25px;
    text-align: center;
    }
.rank_ttl >div{
    font-size: 60px;
    color: #fd4a5b;
    display: inline-block;
    }
.rank_ttl >img{
    display: inline-block;
    margin-bottom: 20px}
.rank3 .rank_ttl >img,.rank4 .rank_ttl >img{
    margin-bottom: 10px;}
.rank_ttl h3{
    font-weight: 600;
    display: inline-block;
    font-size: 26px; }
.rank_ttl h3 small{
    font-size: 16px;}
#rank .sub_rank,#rank .rank1,#rank .rank2{
    box-shadow: 0 0 2px rgba(0, 0, 0, .3);
    border: 10px solid #fff;
    border-radius: 5px;
    background: url(../images/rank_box_bk.jpg) repeat;
    margin-bottom: 15px;
    padding: 10px 10px 25px;}
.sec02{
    padding: 0 10px;
    margin-bottom: 20px; }
.sec02 img{
    float: left;
    width: 250px;
    box-shadow: 0 0 2px rgba(0, 0, 0, .3)
    }
.sec02 .score{
    border: 5px solid #cea58d;
    background: #fff;
    float: right;
    padding: 15px 30px;
    width: 280px;
    }
.sec02 .score dl{
    overflow: hidden;}
.sec02 .score dt{
    font-size: 16px;
    border-bottom: dotted 1px #cea58d;
    color: #cea58d;
    float: left;
    margin-top: 4px;
    height: 27px;
    width: 135px;}
.sec02 .score dd {
    float: left;
    border-bottom: dotted 1px #cea58d;
    margin-left: 0;
}
.sec02 .score .component{
    border-bottom:none;
    width: 100%;
    margin-bottom: 5px
    }
.sec02 .score .component:after{
    content: url(../images/icon_1.png);
    position: relative;
    bottom: -3px;
    left: 2px;}
.sec02 .score dd:last-child{
    border-bottom:none;
    width: 100%
    }
.ratingicon,rating_area{
    display: inline-block;}
.rating_base,
.rating_score{
    width: 134px;
    height: 31px;}
.rating_area{
    width:134px;
    height:31px;
    position: relative;}
.rating_base,
.rating_score{
    position: absolute;
    top: 0;
    left: 0;}
.rating_score{
    background: url(../images/star_score.png);
    z-index:1;}
.rating_base{
    background: url(../images/star_base.png) no-repeat;}
.sec03{
    text-align: center;
    padding: 0 10px;}
.sec03 p{
    text-align: justify;
    margin-bottom: 10px}
#rank .herf{
    width: 43%;
    float: left;
    box-shadow: 0 0 2px rgba(0, 0, 0, .3);
    border: 10px solid #fff;
    border-radius: 5px;
    background: url(../images/rank_box_bk.jpg) repeat;
    padding: 10px 10px 25px;}
#rank .rank3{
    margin-right: 15px;}
#rank .herf .rank_ttl >div{
    font-size: 33px;}
#rank .herf .rank_ttl h3{
    font-size: 21px; }
#rank .herf .rank_ttl h3 small{
    font-size: 14px;}
#rank .herf .sec02 img {
    float: none;
    width: 100%;
    box-shadow: 0 0 2px rgba(0, 0, 0, .3);}
#column1{
    padding: 10px 80px;
    background: url(../images/main_column_bk.png) no-repeat;
    height: 804px;
    margin-bottom: 30px;
    }
#column1 .column_ttl{
    position: relative;
    margin-bottom: 28px;
    text-align: center;}
#column1 .column_ttl img{
    margin: -20px 0 0 -30px;}
.column_ttl a{
    position: absolute;
    bottom: -10px;
    right: 0;}
#column1 ul {
    width: 545px;
    overflow: hidden;}
#column1 ul li{
    float: left;
    width: 225px;
    margin: 0 25px 25px 0;
    border-radius: 10px;
    background: #fff;
    padding: 10px;}
#column1 ul li:hover{
    cursor: pointer;}
#column1 ul li >img{
    width: 215px;
    margin-bottom: 10px;
    box-shadow: 0 0 2px rgba(0, 0, 0, .3);
    border: 5px solid #fff;}
.date{
    padding: 0 20px;
    margin-bottom: 10px}
.date p{
    float: left;
    margin-right: 5px;
    color: #fd4a5b; }
.cate1,.cate2,.cate3,.cate4{
    font-size: 12px;
    float: left;
    color: #fff;
    padding: 0px 5px;}
.cate1{
    background: #fd4a5b;}
.cate2{
    background: #f9b93e;}
.cate3{
    background: #ffa239;}
.cate4{
    background: #ff9a9a;}
#column1 ul li h3 a{
    padding: 0 20px;
    font-size: 20px;
    text-decoration: underline;}
#siteinfo h2{
    border-radius: 5px;
    text-align: center;
    padding: 10px;
    background: #fac767;
    color: #fff;
    font-size: 25px;
    margin-bottom: 15px;
    }
#siteinfo p{
    padding: 0 30px;}
/*side
---------------------------------*/
#bnrarea{
    margin-bottom: 20px;}
#bnrarea a img{
    box-shadow: 0 0 2px rgba(0, 0, 0, .3);}
.side_column_ttl{
    margin: 0 auto 10px;
    position: relative;
    width: 239px;
    height: 61px;
    background: url(../images/side_column_ttl.png) no-repeat;}
.side_column_ttl h2{
    color: #cea58d;
    position: absolute;
    top: 5px;
    right:0;}
nav{
    margin-bottom: 20px;}
nav ul {
    border: 3px solid #ff9a9a;
    border-radius: 10px;
    padding: 10px;}
nav li{
    border-bottom: 1px dotted #ff9a9a}
nav li a{
    background: url(../images/icon_2.png)no-repeat;
    background-position: 0px 50%;
    font-size: 16px;
    width: 200px;
    display: inline-block;
    padding: 10px 35px;}
nav li:last-child{
    border-bottom: none;}
#side_rank ul{
    padding: 0 10px;
    text-align: center;}
#side_rank li{
    margin-bottom: 15px;}
#side_rank li img,#side_rank li h3,.side_top li h4{
    display: inline-block;
    vertical-align: middle;}
#side_rank li >img{
    margin: 0 15px 10px 0;}
#side_rank li h3,.side_top li h4{
    text-align: justify;
    font-size: 18px;
    width: 200px;}
.page_top{
    position: fixed;
    bottom: 40px;
    right: 10px;}
/*footer
---------------------------------*/
footer{
    background: #f9f7f4;
    padding: 45px 0 0;}
footer >.inner{
    margin-bottom: 45px}
footer .sitettl{
    float: left;
    font-size: 33px;
    color: #7b5749;
    margin: 0 70px;
    line-height: 1.2;
    text-align: center;}
footer .sitettl .pk1,footer .sitettl .pk2,footer .sitettl .or,footer .sitettl .ye{
    font-size: 66px}
#footer{
     float: left;}
#footer >ul >li{
    float: left;}
#footer h4{
    margin-bottom: 20px;
    font-size: 16px;}
#footer a{
    color: #ff8584;
    text-decoration: underline;
    }
#footer a:hover{
    color: #ffa239}
#footer ul li ul li{
    margin: 10px 10px 10px 0;;}
#footer ul li ul li i{
    margin-right: 5px}
.copy{
    color: #fff;
    text-align: right;
    font-size: 13px;
    padding: 5px 0;
    background: url(../images/copy_bk.jpg);}

/*下層
---------------------------------*/
.panknav li{
    margin: -20px 0 8px 0;
    float: left;}
.panknav li a{
    color: #fd4a5b; }
#sub_wrap .sub_rank{
    border-radius: 0;
    background: none;
    box-shadow: none;}
#sub_wrap #rank h2{
    margin-bottom: 0px;
    }
#sub_wrap .rank_ttl h1{
    font-weight: 600;
    display: inline-block;
    font-size: 26px; }
#sub_wrap .rank_ttl h1 small{
    font-size: 16px;}
#sub_wrap .sec03{
    padding: 25px;
    margin-bottom: 20px;
    border-radius:10px;
-moz-border-radius:10px;
-webkit-border-radius:10px;
    box-shadow:0px 0px 10px 0px #ff7d89 inset;
-moz-box-shadow:0px 0px 10px 0px #ff7d89 inset;
-webkit-box-shadow:0px 0px 10px 0px #ff7d89 inset;
    text-align: justify;}
.point{
    margin-bottom: 30px;}
.point h2{
    margin-bottom: 10px;
    font-size: 18px;
    text-align: center;
    color: #fff;
    background: url(../images/point_bk.png) no-repeat;
    display: inline-block;
    padding: 12px 32px 17px;}
.care_point h2{
    margin-bottom: 10px;
    font-size: 18px;
    text-align: center;
    color: #fff;
    background: url(../images/carepoint_bk.png) no-repeat;
    display: inline-block;
    padding: 12px 20px 20px;}
#sub_wrap .sec04{
    padding: 25px 35px;
    border-radius:10px;
-moz-border-radius:10px;
-webkit-border-radius:10px;
    box-shadow:0px 0px 10px 0px #ffad4c inset;
-moz-box-shadow:0px 0px 10px 0px #ffad4c inset;
-webkit-box-shadow:0px 0px 10px 0px #ffad4c inset;
    text-align: justify;}
#sub_wrap .sec04 h2{
    text-align: center;
    color: #ffad4c;
    font-size: 50px;
    padding-bottom: 15px;
    margin-bottom: 15px;
    background: url(../images/line.png) bottom no-repeat;
}
#sub_wrap .sec04 li{
    margin-bottom: 5px;}
#sub_wrap .sec04 li img{
    float: left;
    width: 104px;}
#sub_wrap .sec04 li p{
    margin-top: 15px;
    float: right;
    width: 450px;}
#sub_page h1{
    padding: 15px 25px;
    margin-bottom: 10px;
    font-size: 32px;
    font-weight: 600;
    border-left: 10px solid #fd4a5b}
#sub_page >img{
    margin-bottom: 20px;
    border: 5px solid #fff;
    box-shadow: 0 0 2px rgba(0, 0, 0, .3);
    width: 670px;}
#sub_page div{
    padding: 0 20px;}
#sub_page >p{
    margin-bottom: 30px;
    }
#sub_page li{
    margin-bottom: 20px;}
#sub_page .list{
    margin: 20px;}
#sub_page .list li{
    margin: 5px 0;
    list-style: decimal inside;
    }
#sub_page .list2{
    margin: 20px;}
#sub_page .list2 li{
    margin: 5px 0;
    list-style: square inside;
}
#sub_page dt{
    font-size: 120%;
    font-weight: bold;}
#sub_page dt:before{
    font-size: 120%;
    font-weight: normal;
    content: "\f046";
    font-family: FontAwesome;
    color: #ffad4c;
    margin-right: 5px;}
#sub_page dd{
    border-bottom: 1px dashed #ddd;
    margin: 0 auto 15px;
    padding: 5px 0 15px;}
.left_img img{
    margin: 0 10px 20px 0;
    width: 215px;
    float: left;}
.right_img img{
    margin: 0 0px 20px 10px;
    width: 215px;
    float: right;}
#sub_page h2{
    margin-bottom: 20px;
    font-size: 22px;
    color: #fff;
    font-weight: 500;
    padding: 15px 30px;
    border-radius: 5px;
    background: url(../images/rank_h2_bk.jpg) #ffad4c;}
#sub_page h3 {
    background: #fff3bf;
    padding: 10px 20px 7px;
    display: inline-block;
    margin-bottom: 10px;
    font-size: 120%;
    border-left: 3px #FF8D00 solid;
}

#sub_page >div{
    margin-bottom: 20px;}
#archive h1{
    padding-bottom: 20px;
    margin-bottom: 20px;
     background: url(../images/line.png) bottom no-repeat;
    background-size: contain;
    text-align: center;
    }
#archive li >img{
    border: 5px solid #fff;
    box-shadow: 0 0 2px rgba(0, 0, 0, .3);
    float: left;
    width: 167px;
    height: auto;}
#archive li{
    margin-bottom: 20px;}
#archive li:hover{
    cursor: pointer;}
#archive li .post_txt{
    padding: 0 30px 0 0;
    float: right;
    width: 460px;}
#archive .date{
    padding: 0;
    margin-bottom: 10px}
#archive ul li h2 a{
    padding: 0px;
    font-size: 18px;
    margin-bottom: 5px;
    text-decoration: underline;}
#archive ul li h2 a:hover,#column1 li a:hover{
    color: #ffad4c;
    text-decoration: none;}
.bnr img {
    width: 100%;
    height: auto;
}