/*
 pc_style.css
*/
@charset "utf-8";

/************************************************
 共通設定
************************************************ */
html{
    font-size: 62.5%;
}

body {
    color: #666;
    font-family: Verdana,Arial,Helvetica,sans-serif;
    background-color: #fff;
    font-size: 1.4rem; /* 14px */
    line-height: 150%;
    letter-spacing: 0.1em;
}

/* 写真 */
img.picture {
    border: 1px solid #ccc;
}


/* ==============================================
 フレーム
=============================================== */
/* 全体を包括 */
.frame_outer {
    margin: 0 auto;
    height: auto;
    min-height: 100vh;
    position: relative;
    width: 100%;
    text-align: center;
}

/* コンテンツ */
#container {
    background: url(/user_data/packages/default/img/common/background.png) repeat top center;
    min-height: 58vh;
    margin: 0 auto;
    padding: 0 0 30px 0;
    text-align: left;
    /* width: 980px; */
    width: 100%;
}


/* ==============================================
 カラム指定
=============================================== */

/* メイン部
----------------------------------------------- */
#main_column {
    padding: 10px 0 0;
}

/* 1カラム時 */
#main_column.colnum1 {
    padding: 0 0 10px 0;
    margin: 0 auto;
    /* width: 80%; */
    width: 100%;
}

/* 2カラム時 (共通) */
#main_column.colnum2 {
    width: 78%;
}

/* 2カラム時 (メイン部が左) */
#main_column.colnum2.left {
    padding-left: 1.5%;
    float: left;
}

/* 2カラム時 (メイン部が右) */
#main_column.colnum2.right {
    padding-right: 1.5%;
    float: right;
}

/* 3カラム時 */
#main_column.colnum3 {
    padding-left: 0.5%;
    width: 59%;
    float: left;
}

/* サイドカラム
----------------------------------------------- */
.side_column {
    padding: 10px 0 0;
}
#leftcolumn {
    float: left;
    width: 20%;
}
#rightcolumn {
    float: right;
    width: 20%;
}

/* 他
----------------------------------------------- */
/* ヘッダーとフッターの上下 */
#topcolumn,
#bottomcolumn,
#footerbottomcolumn {
    margin: 0px;
    background: #fff;
    text-align: left;
    clear: both;
}

/* 下層コンテンツ */
#undercolumn,
#fullcolumn{
    width: 100%;
    margin: 0 0 30px 0;
}

#main_column.colnum1 #undercolumn,
#main_column.colnum1 #mypagecolumn{
    margin: 0 auto;
    padding: 50px 0;
    min-width: 980px;
    max-width: 1200px;
}

#main_column.colnum1 #fullcolumn{
    margin: 0 auto;
    padding: 50px 0;
    min-width: 100%;
    max-width: 100%;
}
#main_column.colnum1 #fullcolumn_02{
    margin: 0 auto;
    padding: 0;
    width: 100%;
    min-width: 100%;
    max-width: 100%;
    min-height:400px;
}

/* ==============================================
 ユーティリティ
=============================================== */
/* フロート回り込み解除
----------------------------------------------- */
.clearfix:after {
    display: block;
    clear: both;
    height: 0px;
    line-height: 0px;
    visibility: hidden;
    content: ".";
}
.clearfix {
    display: block; /* for IE8 */
}
.clear {
    clear: both;
}
.red{color:#FF0000;}

/* リンク指定
----------------------------------------------- */
a:link,
a:visited {
    color: #000;
    text-decoration: none;
}
a:link:hover,
a[href]:hover {
    color: #444;
    text-decoration: none;
    opacity: .8;
}
a.text_underline{text-decoration:underline;}

/* フォント
----------------------------------------------- */
h1,
h2,
h3,
h4,
h5 {
    font-size: 100%;
    line-height: 150%;
}
.special_price,
.sale_price {
    color: #f00;
}
.normal_price {
    font-size: 90%;
}
.point {
    color: #f00;
    font-weight: bold;
}
.user_name {
    font-weight: bold;
}
.recommend_level {
    color: #ecbd00;
}

.attention {
    color: #f00;
}
.attentionSt {
    color: #f00;
    font-weight: bold;
}
.st {
    font-weight: bold;
}
.mini {
    font-size: 90%;
}


/* 行揃え
----------------------------------------------- */
.alignC {
    text-align: center;
}
.alignR {
    text-align: right;
}
.alignL {
    text-align: left;
}
.pricetd em {
    font-weight: bold;
}


/* フォーム
----------------------------------------------- */
select {
    border: solid 1px #ccc;
}
input[type='text'],
input[type='password'] {
    border: solid 1px #ccc;
    padding: 2px;
}

.box40 {
    width: 40px;
    min-width: 40px;
    max-width: 40px;
}
.box60 {
    width: 60px;
}
.box100 {
    width: 100px;
}
.box120 {
    width: 120px;
}
.box140 {
    width: 140px;
}
.box145 {
    width: 145px;
}
.box150 {
    width: 150px;
}
.box240 {
    width: 240px;
}
.box300 {
    width: 300px;
}
.box320 {
    width: 320px;
}
.box350 {
    width: 350px;
}
.box380 {
    width: 380px;
}

/* フォームが縦に重なり合う場合に併用する余白 */
.top { /* FIXME 簡素な単語は、単独で、込み入った指定に使用しない */
    margin-bottom: 5px;
}


/* タイトル
----------------------------------------------- */
h2.title {
    background: url() !important;
    background-color: transparent;
    border-top: 0;
    border-bottom: 5px solid #000;
    color: #000;
    font-size: 1.6rem;
    margin-bottom: 50px;
    padding: 8px;
}

#main_column .sub_area h3,
#undercolumn h3,
#undercolumn_login .login_area h3,
#undercolumn_shopping h3,
#mypagecolumn h3,
#undercolumn_cart h3 {
    background-image: none!important;
    border-bottom: 2px solid #333;
    margin: 0 0 10px 0;
    padding: 5px 0 10px;
    color: #000;
    font-size: 1.48rem;
}

div#undercolumn_login .login_area h4 {
    padding-left: 15px;
}


h2.oswald{
    color: #000;
    font-family: Oswald, sans-serif;
    font-size: 30px; /* 30pt */
    font-weight: 200;
    letter-spacing: .12em;
    margin: 0 auto;
    padding: 0.5em 0;
    text-align: center;
}

/* customized button */
.button{
    background: #FFF;
    border: 1px solid #000;
    color: #000;
    display: block;
    font-family: Arimo, sans-serif;
    font-size: 14px;
    font-weight: 600;
    margin: 1em auto;
    padding: 10px 1em;
    width: 30%;
    max-width: 435px;
    min-width: 200px;
    text-align: center;
}
.button.black{
    background: #000;
    border: 1px solid #000;
    color: #FFF;
}
.button.small{
    font-family: Montserrat, sans-serif;
    font-size: 12px;
    max-width: 160px;
}
.button.small_zip{
    color: #000;
    display: inline-block;
    font-size: 11px;
    margin: 0.5em;
    padding: .5em;
    width: 14%;
    min-width: 90px;
    max-width: 90px;
}
a.button:hover, a.button:link, a.button:visited{text-decoration: none;}
a.button:hover,a.button:link,a.button:visited,
a.button.small:hover,a.button.small:link,a.button.small:visited,
a.button.small_zip:hover, a.small_zip:link, .small_zip:visited{color: #000;}
a.button.black:hover, a.button.black:link, a.button.black:visited{color: #FFF;}

/* ==============================================
 ヘッダー
=============================================== */
/* レイアウト
----------------------------------------------- */
#header_wrap {
    border-top: 0;
    background: url() no-repeat bottom #000;
    margin: 0 auto;
    width:100%;
    height:90px;
    min-height: 90px;
    box-sizing: border-box;
}
#header {
    border: 0;
    box-sizing: border-box;
    display: table;
    font-family: Arimo, Arial, sans-serif;
    font-weight: 600;
    margin: 0 auto;
    padding: 0;
    width: 1200px;
    height: auto;
}
#header #logo_area, #header #header_utility, #header #global_navi,#header #header_navi{
    display: table-cell;
    box-sizing:border-box;
    vertical-align: middle;
}
#header #logo_area a, #header #header_utility a, #header #header_navi a{display:block;z-index:9999;}
#header #logo_area{width: 310px;height:90px;padding-left: 10px;padding-top:27px;box-sizing:border-box;}
#header #logo_area img{width:280px;}

#header_utility {width:0;}
#headerInternalColumn{float: none; width: 0;height: auto;margin-top:0; margin-bottom: 0;}

/* ヘッダーナビ
----------------------------------------------- */

div#header_navi ul{
    display: flex;
    justify-content: center;
    align-items: bottom;
    float: none;
    width: 100%;
    height: 90px;
}
div#header_navi ul li {
    float: none;
    height: 75px;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    padding-bottom: 8px;
}
div#header_navi ul li.mypage,
div#header_navi ul li.entry {
    margin-top: 6px;
}

div#header_navi{width: 190px;height:90px;}

#header_navi li{width:25%;}
#header_navi li:last-child{position:relative;}
#header_navi li img{width: 46px;}
#header_navi span.count_item{
    position: absolute;
    top: 18px;
    right: 0;
    display: block;
    background: red;
    width: 2em;
    height: 2em;
    color: #FFF;
    border-radius: 25px;
    font-family: sans-serif;
    font-size: 8px;
    text-align: center;
    vertical-align: middle;
    line-height: 2em;
    margin: 0;
    padding: 0;
}

#global_navi{
    background: #000;
    color: #FFF;
    margin: 0 auto;
    width:700px;
    box-sizing: border-box;
    padding-left: 30px;
}
#global_navi ul{
    display: flex;
    flex-wrap: nowrap;
    justify-content: center;
    margin: 0 auto;
    max-width: 700px;
    position: relative;
    height: 90px;
}
#global_navi li{
    box-sizing: border-box;
    display: flex;
    align-items:center;
    justify-content: center;
    flex-direction: column;
    padding: 0.6em;
    text-align: center;
}
#global_navi li a{
    color: #FFF;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: Arimo, Arial, sans-serif;
    font-weight: bold;
    width: 100%;
    height: 90ox;
    text-decoration: none;
}

#global_navi input[type = "text"]{
    border: 1px solid #000;
    border-bottom: 1px solid #FFF;
    background: #000;
    color: #FFF;
    width: 190px;
    padding-left: 1em;
    box-sizing: border-box;
    display: inline-block;
    margin: 0 auto 12px 6px;
}
#global_navi input[type = "image"]{margin-top: -37px; margin-left: -160px;}


#global_navi li.header_brand ul.child,
#global_navi li.header_cat ul.child{
    box-sizing: border-box;
    display: none;
    position: absolute;
    z-index:200;
    top:35px;
    left: 0;
    margin: 0;
    padding:40px 20px 0 0;
    width: 100%;
    -webkit-transition: all .2s ease;
    transition: all .2s ease;
    overflow: visible;
}
#global_navi li.header_brand ul.child{
    left: 2%;
}
#global_navi li.header_cat ul.child{
    left: 13%;
}
#global_navi li ul.child li{
    background: #fff;
    border-right: 0;
    color: #000;
    width:180px;
    float:inherit;
    margin: 0;
    padding: 0 20px;
    text-align: left;
    z-index: 200;
}

#global_navi li ul.child li:last-child a{
    border-bottom: 0;
}
#global_navi li ul.child li a{
    border-bottom: 1px solid #000;
    font-family: Signika, sans-serif;
    font-size:1em;
    font-weight: normal;
    color:#000;
    display:block;
    letter-spacing: .2em;
    padding:20px 0;
    margin: 0;
    text-decoration:none;
    -webkit-transition: opacity 0.3s ease-out;
    -moz-transition: opacity 0.3s ease-out;
    -o-transition: opacity 0.3s ease-out;
    transition: opacity 0.3s ease-out;
    z-index: 200;
}
#global_navi li ul.child li a:hover{
    color: #ff2d86;
}


#errorHeader {
    color: #F00;
    font-weight: bold;
    font-size: 12px;
    background-color: #FEB;
    text-align: center;
    padding: 5px;
}



/* ==============================================
 フッター
=============================================== */

#pagetop {
    display: block;
    width: 60px;
    text-align: center;
    position: fixed;
    right: 40px;
    bottom: 40px;
    background: #000;
    color: #FFF;
    box-shadow: 1px 3px 5px rgba(0,0,0,0.4);
}
#pagetop a{
    color: #fff;
}
#pagetop img{
    width: 60px;
}
#footer_wrap{
    margin: 0 auto;
    padding: 0;
    width: 100%;
    height: auto;
    border: 0;
}
#footer{
    border: 0;
    margin: auto;
    padding-top: 10px;
    width: 100%;
    position: relative;
}
#footer_nav{
    margin: 0 auto;
    padding: 50px 0;
    background: #000;
    color: #FFF;
}
#footer h3{font-family: Arial, sans-serif; font-weight: 600; font-size: 14px;}
#footer ul{display:flex; justify-content: center; margin: 20px auto;width: 1200px;}
#footer ul.footer_sns{width:600px;}
#footer ul > li{padding:10px;}
#footer a, footer a:link, footer a:visited, footer a:hover{font-size:12px;color: #FFF;}
#copyright{
    background: #E2E2E2;
    font-size: 10px;
    font-style:normal;
    text-align: center;
    margin: 0 auto;
    padding: 20px 0;
    width: 100%;
}
#copyright address{font-style:normal;}


/* ==============================================
 パーツ
=============================================== */
/* ボタン
----------------------------------------------- */
.btn_area {
    margin-top: 10px;
    width: 100%;
    text-align: center;
}
.btn_area ul{
    display: flex;
    justify-content: center;
    margin: 30px auto;
    min-width: 50%;
}

.btn_area li {
    padding: 10px;
    max-width: 100%;
}


/* 完了メッセージ
----------------------------------------------- */
div#complete_area {
    margin-bottom: 20px;
}
div#complete_area .message,
div#undercolumn_entry .message {
    margin-bottom: 20px;
    line-height: 150%;
    font-weight: bold;
    font-size: 120%;
}
div#complete_area .shop_information {
    margin-top: 40px;
    padding: 20px 0 0 0;
    border-top: solid 1px #ccc;
}
div#complete_area .shop_information .name {
    margin-bottom: 10px;
    font-weight: bold;
    font-size: 140%;
}


/*
  bloc.css の上書き用
*/
#container .block_outer{
    padding: 0;
}
/* h2 */
#login_area h2, #search_area h2, #calender_area h2, #cart_area h2, #cart h2,
#recommend_area h2, #news_area h2{
    background-image: none!important;
    background-color: transparent;
    border: 0;
    color: #000;
}
#container .login_area dl.formlist dt{
    background-image: none!important;
}

#calender_area{
    background: #fff;
}
#calender_area .block_body {
    background-color: #fff;
    display: flex;
}

/* footer上のナビ */
#calender_area,
#guide_area{
    margin: 0 auto;
    max-width: 1200px;
}
#guide_area ul.button_like{
    display: flex;
}
#guide_area ul.button_like li{
    padding: 1rem;
    background: url();
}
#guide_area ul.button_like li a{
    background: url();
    border: 0;
}

/*
bloc_alpha.css の上書き用
*/
#header_login_area{
    border: 0;
    background: #fff;
    letter-spacing: 0;
}

/* contents.css */
#undercolumn_entry{
    margin: 0 auto;
    max-width: 1200px;
}
table td{background:#fff;}

/* -----------------------

added blocks

----------------------- */
/* -----------------
    top page
------------------- */
.main_slide{
    opacity: 0;
}
.main_slide.slick-initialized{
    opacity: 1;
}
/* TOP SLIDER */
#top_slide{
    margin: -10px auto 10px auto;
    width: 100%;
    position: relative;
}
#top_slide .slick-slide{
    border: 4px solid #000; border-collapse:collapse;border-left:0;}
}
#top_slide .slick-slide img{
    width: 1200px;
    height: 480px;
}

#top_slide .slick-slide:not(.slick-center) {
    -webkit-filter: brightness(40%);
    -moz-filter: brightness(40%);
    -o-filter: brightness(40%);
    -ms-filter: brightnes(40%);
    filter: brightness(40%);
    transition: 0.2s linear;
}
#top_slide div img{width:100%;}
#top_slide .slide-dots{
    margin: 0 auto;
    padding: 20px 0;
    display: flex;
    justify-content: center;
}
#top_slide .slide-dots li{
    padding: 10px 14px;
}
#top_slide .slide-dots li button{
    margin: 0;
    padding: 0;
    background: none;
    border: none;
    border-radius: 0;
    outline: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    position: relative;
    text-indent: -9999px;
}
#top_slide .slide-dots li button:before{
    content: '●';
    font-size: 20px;
    text-indent: 0px;
    position: absolute;
    top: 0;
    left: 0;
    color: #ccc;
}
#top_slide .slide-dots li.slick-active button:before{
    content: '●';
    color: #666;
}

/* TOP RANKING */
#top_ranking{
    margin: 0 auto;
    padding: 25px 0;
}
#top_ranking h2{
    text-align: center;
    color: #000;
}
#top_ranking .ranking_wrap{
    margin: 0 auto;
    width: 1200px;
    position: relative;
}
#top_ranking ol {
    margin: 0 auto;
}
#top_ranking li{
    width: 215px;
    height: 320px;
    padding-top: 30px;
}
#top_ranking li a{
    display: block;
    width: 100%;
    height: 100%;
    position: relative;
}
#top_ranking li a p.rank_icon{
    position: absolute;
    top: -14px;
    left: 0;
    z-index: 200;
}
#top_ranking li a p.rank_icon img{
    height: 32px;
    z-index: 100;
}
#top_ranking li a dl{
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
}
#top_ranking li a dt img{
    margin-top: 0;
    width: 215px;
    z-index: 99;
}
#top_ranking a dd{
    font-size:11px;
    color: #000;
    padding-right: 2em;
}
#top_ranking .slick-prev,
#top_ranking .slick-next{
    position: absolute;
    top: 32%;
    z-index: 101;
}
#top_ranking .slick-prev{left: -10px;}
#top_ranking .slick-next{right: 0;}
#top_ranking .slick-prev.slick-disabled,
#top_ranking .slick-next.slick-disabled {
    visibility: hidden;
}

/* TOP NEW ITEM */
#main_column #recommend_area h2,
#main_column #webonlyitem_area h2
{
    text-align: center;
}

#main_column #recommend_area .block_body, 
#main_column #webonlyitem_area .block_body
{
    margin: 0 auto;
    width: 1200px;
    border: 0;
    position: relative;
}

#main_column #recommend_area .product_item,
#main_column #webonlyitem_area .product_item
{
    width: 215px;
}
#main_column #recommend_area .product_item .productImage,
#main_column #recommend_area .product_item .productContents,
#main_column #webonlyitem_area .product_item .productImage,
#main_column #webonlyitem_area .product_item .productContents

{
    width: 100%;
    float: none;
    clear: both;
}
#main_column #recommend_area .product_item .productImage h3,
#main_column #recommend_area .product_item .productImage .sale_price,
#main_column #webonlyitem_area .product_item .productImage h3,
#main_column #webonlyitem_area .product_item .productImage .sale_price
{
    font-size:12px; color: #000;
}

#main_column #recommend_area .product_item .productImage img,
#main_column #webonlyitem_area .product_item .productImage img
{
    width: 215px;
}

#main_column #recommend_area .product_item .productImage h3,
#main_column #webonlyitem_area .product_item .productImage h3
{
    padding-right: 2em;
}

#recommend_area .block_body, #webonlyitem_area .block_body{background:url();}
.newitem_slide .slick-prev,
.newitem_slide .slick-next,
.webonlyitem_slide .slick-prev,
.webonlyitem_slide .slick-next
{
    position: absolute;
    top: 32%;
    z-index: 101;
}
.newitem_slide .slick-prev, .webonlyitem_slide .slick-prev{left: -10px;}
.newitem_slide .slick-next, .webonlyitem_slide .slick-next{right: 0;}


/* TOP CONTENTS */
#top_feature{
    margin: 0 auto;
    padding: 50px auto;
}
#top_feature .feature_banners{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin: 0 auto;
    width: 1200px;
}
#top_feature .feature_banners a{
    font-size:12px;
    display: block;
    width: 33%;
}

#top_feature .feature_banners a,#top_feature .feature_banners a:hover,  #top_feature .feature_banners a:link, #top_feature .feature_banners aa:visited{color:#000;}

/* TOP ABOUT */
#top_concept{
    margin: 0 auto;
    padding: 20px 0 30px 0;
}
#top_concept h2{
    text-align: center;
}
#top_concept h2 a img{
    width: 780px;
}

#top_feature{
    margin: 0 auto;
    padding: 20px 0 48px 0;
}

/* TOP IG */
#top_instagram{
    background: #e5e5e5;
    box-sizing: border-box;
    padding: 50px 0;
    text-align: center;
}

#top_instagram ul{
    list-style-type: none;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    max-width: 1200px;
    margin: 0 auto;
    padding: 20px 0 5px 0;
}
#top_instagram li{
    width: 20%;
    padding-bottom: 15px;
}
#top_instagram li a img{
    width: 225px;
}

/* TOP NEWS, NEWS LIST */
.block_outer #news_area,
#news_area{
    margin: 0 auto;
    padding: 50px auto;
}
#undercolumn #news_area{
    width: 100%;
    max-width: 1200px;
    min-height: 400px;
    margin: 0px auto;
    padding: 0px;
}
#news_area h2{
    padding-top: 50px;
    text-align: center;
}
#undercolumn #news_area h2{
    border-bottom: 3px solid #000;
    font-size: 24px;
    text-align: left;
    padding-top: 0;
}
#news_area .block_body{
    border: 0;
    margin: 0 auto;
}
#news_area .news_contents{
    margin: 20px auto;
    width: 700px;
    max-height: 400px;
    overflow: auto;
    overflow-y: auto;
}
#undercolumn #news_area .news_contents{
    width: 980px;
    min-height: 300px;
    max-height: auto;
}
#news_area dl.newslist{
    background: url();
    border-bottom: 1px solid #ccc;
    display: flex;
    padding: 0;
}
#news_area dl.newslist dt{
    padding-top: 5px;
    padding-bottom: 4px;
    width: 32%;
}
#undercolumn #news_area dl.newslist dt{
    width: 22%;
}
#news_area dl.newslist dd{
    background: url(/user_data/packages/default/img/common/news_arrow.png) no-repeat center right;
    margin-bottom: 0;
    padding-right: 2em;
    padding-bottom: 4px;
    padding-top: 5px;
    width: 68%;
}
#undercolumn #news_area dl.newslist dd{
    width: 78%;
}
#news_area a, #news_area a:link, #news_area a:visited, #news_area a:hover{color: #000;}
#news_area .right{text-align: right;}
#news_area .right a.button{
    margin: 20px 0;
    float: right;
    width: 180px;
    max-width: 180px;
}
#news_area .news_pager{
    margin: 50px auto;
}


/* -----------------

undercolumn contents

------------------- */
#undercolumn{
    color: #000;
    margin: 0 auto;
    width: 100%;
    max-width: 1200px;
    height: auto;
    min-height: 90vh;
}
.mh_auto{
    min-height: 0;
}
/* -----------------
user guide, faq, policy
------------------- */
#user_guide,
#faq_column,
#privacy_column{
    margin: 0 auto;
    padding: 20px;
}
#user_guide section,
#faq_column section,
#privacy_column section{
    margin: 50px auto;
    padding: 0 0 50px 0;
}

#faq_column a,
#user_guide a{
    color: #FF0000;
}
#user_guide a.button{
    color: #000;
}
#user_guide a.button.black{
    color: #FFF;
}
#user_guide section h3,
#faq_column h3{
    border-top: 0;
    margin-bottom: 0;
    padding: 1em;
    background: #000;
    color: #FFF;
}

#user_guide section h4,
#faq_column section dt,
#privacy_column h3{
    border-left: 8px solid #ccc;
    border-bottom: 0;
    color: #000;
    display: inline-block;
    font-size: 14px;
    font-weight: 600;
    line-height: 100%;
    margin-top: 30px;
    padding: 10px 1rem;
    width: auto;
    min-width: 0;
    max-width: 50%;
}
#user_guide section h5,
#user_guide section dt,
#privacy_column h5,
#privacy_column dt{
    color: #000;
    font-size: 14px;
    font-weight: 600;
    padding: 20px 20px 0 20px;
}
#user_guide section dt,
#privacy_column dt{
    padding: 30px 0 10px 0;
}

#faq_column dd,
#user_guide p,
#user_guide dl,
#user_guide ul{
    margin: 20px;
}
#user_guide blockquote{
    margin: 20px;
    padding: 20px;
    background: #eee;
}
#undercolumn_login blockquote,
#undercolumn_shopping blockquote{
    margin: 20px 0;
    padding: 20px;
    background: #eee;
}
#user_guide blockquote h5,
#undercolumn_login blockquote h5,
#undercolumn_shopping blockquote h5{
    border-top: 1px solid #000;
    border-bottom: 1px solid #000;
    margin: 10px auto 40px auto;
    padding: 1em 0;
    text-align: center;
    width: 60%;
}
#user_guide blockquote.pw_setting,
#undercolumn_login blockquote.pw_setting,
#undercolumn_shopping blockquote.pw_setting{
    background: #fae3dd;
}
#user_guide blockquote.pw_setting h5,
#undercolumn_login blockquote.pw_setting h5,
#undercolumn_shopping blockquote.pw_setting h5{
    border-top: 1px solid #f00;
    border-bottom: 1px solid #f00;
    color: #f00;
}
#user_guide ul,
#user_guide ul > li,
#privacy_column ul,
#privacy_column > li{
    list-style-type:circle;
    padding: 0 1em;
}


/* -----------------
mypage
------------------- */
#container .login_area dl.formlist.clearfix{
    display: flex;
    margin: 20px auto;
    padding: 10px;
    width: 680px;
}
#container .login_area dl.formlist.clearfix dt{
    width: 20%;
}
#container .login_area dl.formlist.clearfix dd{
    width: 80%;
}

/* -----------------
news
------------------- */
#news_topic{
    margin: 0 auto;
    padding: 20px 0;
}
#news_topic .news_text{
    padding; 20px;
    min-height: 40vh;
    border-bottom: 2px solid #000;
}
#news_topic p.news_date{
    text-align: right;
}
#news_area a.button,
#news_area a.button.small,
#news_area a.button.black{
    display: inline-block;
}
#news_area a.button.black{
    color: #FFF;
}

/* -----------------
concept about
------------------- */
#concept{
    margin: 0 auto;
    padding: 20px 0;
}
#news_wrap{
    margin: 0 auto;
    padding: 20px 0;
}

div#undercolumn_shopping .point_area .point_announce {
    background: #FFF;
}


/* -----------------
list, category, brand
------------------- */
#brand_banner,
#brand_banner h2,
#category_banner,
#category_banner h2{
    margin: 0 auto;
    padding: 0;
    width: 100%;
    height: 400px;
}
/*
#category_banner h2{
    background: url(/user_data/packages/default/img/category/category_eyes.jpg) no-repeat top center;
    background-size: cover;
}
#category_banner h2.cat_01{
    background: url(/user_data/packages/default/img/category/category_eyes.jpg) repeat-x top center;
    background-size: auto 100%;
}

#brand_banner h2{
    background: url(/user_data/packages/default/img/dev/brand_wp_dummy.jpg) no-repeat top center;
    background-size: cover;
}
#brand_banner h2.cat_02{
    background: url(/user_data/packages/default/img/dev/brand_wp_dummy.jpg) no-repeat top center;
    background-size: cover;
}
*/
#product_list{
    margin: 0 auto;
    width: 100%;
}

#product_list .sub_guide{
    display: flex;
    height: 50px;
    line-height: 50px;
    width: 100%;
    position: relative;
    margin: 0 auto 50px auto;
}
#product_list .sub_guide h2{
    font-family: メイリオ, Meiryo, sans-serif;
    font-size: 21px;
    font-weight: 600;
    text-align: center;
    border-bottom: 0;
    width: 100%;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
}
#product_list .sub_guide .sort_list{
    display: block;
    width: 40%;
    height: auto;
    text-align: right;
    position: absolute;
    bottom: 0;
    right: 0;
}

#product_list nav,
#ranking_page nav{
    margin: 10px 0 50px 0;
    width: 100%;
}
#product_list nav ul,
#ranking_page nav ul{
    display: flex;
    justify-content: space-between;
    text-align: center;
    padding-bottom: 5px;
    border-bottom: 1px solid #ccc;
}
#product_list nav li,
#ranking_page nav li{
    border-right: 1px solid #ccc;
    display:inline-block;
    text-align: center;
}
#product_list nav.cat_nav li,
#ranking_page nav li{
    width: 16.6%;
}
#product_list nav.brand_nav li{
    width: 30%;
}

#product_list nav li:last-child,
#ranking_page nav li:last-child{
    border-right: 0;
}
#product_list nav li a.selected,
#ranking_page nav.cat_nav li.selected a{
    color: #ff2d86;
}

.item_wrap{
    margin: 0 auto;
    padding: 0;
    width: 1200px;
    height: auto;
    min-height: 90vh;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    box-sizing: border-box;
}
.item_wrap::after{
    content:"";
    display: block;
    width:285px;
}
.item_box{
    margin: 0 20px 0 0;
    padding: 0;
    width: 285px;
    height: 480px;
    box-sizing: border-box;
    position: relative;
}
.item_box:nth-child(4n){
    margin-right: 0;
}
.item_box.div.list_area{
    margin: 0;
    padding: 0;
    width: 100%;
    height: 100%;
    position: relative;
}
.item_box .icon_fav{
margin: 0;
padding: 0;
position: absolute;
top: 5px;
right: 5px;
z-index: 100;
width: 100%;
box-sizing: border-box;
text-align: right;
}
.item_box > a.item_link{
    display: block;
    width: 100%;
    height: 480px;
    text-decoration: none;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
}
.item_box > a:hover,
#undercolumn.item_box > a[href]:hover h3,
#undercolumn.item_box > a[href]:hover p{
    text-decoration:none;
}
#undercolumn.item_box > a h3,
#undercolumn .item_box h3{
    font-size: 12px;
    font-weight: normal;
    border-bottom: 0;
    margin: 0;
    padding: 0;
    width: 285px;
}
div.list_area{
    overflow: hidden;
}
div.listphoto{
    float: none;
    clear: both;
    width: 100%;
    padding-bottom: 10px;
}
div.listphoto img.picture{
    width: 285px;
    border: 1px solid #ccc;
    box-sizing: border-box;
}
ul.status_icon{
    display:flex;
    justify-content: flex-start;
    flex-wrap: wrap;
}
div.list_area .special_price{
    color: #FF0000;
}

#page_navi_bottom{
    margin: 0 auto;
    padding: 0;
    width: 100%;
}
#page_navi_bottom ul{
    margin: 0 auto;
    padding: 0;
    display: flex;
    justify-content: space-between;
    width: 380px;
}
#page_navi_bottom ul > li{
    box-sizing: border-box;
    width: 40px;
    height: 40px;
    text-align: center;
}
#page_navi_bottom ul > li a{
    background: #FFF;
    border: 1px solid #000;
    box-sizing: border-box;
    color: #000;
    display: inline-block;
    width: 40px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    vertical-align: middle;
    text-decoration: none;
}
#page_navi_bottom ul > li a.selected{
    background: #000;
    color: #FFF;
}
#page_navi_bottom ul > li.nav_prev a,
#page_navi_bottom ul > li.nav_next a{
    background: transparent;
    border: 0;
}

/* -----------------
products detail
------------------- */
#detailarea{
    display: flex;
    margin: 0 auto 20px auto;
    width: 980px;
}
#main_column.colnum1 div#detailphotobloc,
#main_column.colnum1 div#detailrightbloc{
    float: none;
    justify-content: space-between;
}

/* 左カラム写真関連 */
#main_column.colnum1 div#detailphotobloc{
    width: 465px;
    margin: 0;
    padding: 0;
}

#main_column.colnum1 div#detailphotobloc .photo.main_image{
    margin: 0;
    padding: 0;
    width: 465px;
    position: relative;
}
#main_column.colnum1 div#detailphotobloc .photo.main_image ul.slides{
    margin: 0 auto;
    padding: 0;
    display: flex;
    flex-wrap: nowrap;
    width: 465px;
    overflow-x: hidden;
}
#main_column.colnum1 div#detailphotobloc .photo.main_image ul.slides li img{
    margin: 0 auto;
    padding: 0;
    width: 465px;
    border: 1px solid #CCC;
    box-sizing: border-box;
}
#main_column.colnum1 div#detailphotobloc .photo.main_image ol#detail_thumb{
    display: flex;
    flex-wrap: wrap;
    justify-content:flex-start;
    width: 465px;
    position: relative;
    margin-top: 20px;
}

#main_column.colnum1 div#detailphotobloc .photo.main_image ol#detail_thumb li{
    width: 60px;
    margin-right: 20px;
    padding-bottom: 20px;
}
#main_column.colnum1 div#detailphotobloc .photo.main_image ol#detail_thumb li:nth-child(6n){
    margin-right: 0;
}
#main_column.colnum1 div#detailphotobloc .photo.main_image ol#detail_thumb li img{
    margin: 0 auto;
    padding: 0;
    width: 60px;
    border: 1px solid #CCC;
    box-sizing: border-box;
}
#main_column.colnum1 div#detailphotobloc .photo.main_image ul.direction-nav{
    display:flex;
    justify-content: space-between;
    width: 100%;
    position: absolute;
    top: 35%;
    bottom: 45%;
    left: 0;
    right: 0;
}
#main_column.colnum1 div#detailphotobloc .photo.main_image ul.direction-nav li{
    display: block;
    width: 17px;
    height: 47px;
    position: relative;
}
#main_column.colnum1 div#detailphotobloc .photo.main_image ul.direction-nav li a{
    display: block;
    width: 17px;
    height: 47px;
    position: absolute;
    text-indent: -9999px;
}
#main_column.colnum1 div#detailphotobloc .photo.main_image ul.direction-nav a.prev{
    background: url(../img/products/item_slider_prev.png) no-repeat top right;
    top: 0;
    left: -30px;
}
#main_column.colnum1 div#detailphotobloc .photo.main_image ul.direction-nav li a.next{
    background: url(../img/products/item_slider_next.png) no-repeat top left;
    top: 0;
    right: -30px;
}


/* 右カラム 商品基本情報 */
#main_column.colnum1 div#detailrightbloc{
    box-sizing: border-box;
    width: 515px;
    margin: 0;
    padding: 0 0 0 70px;
}

#main_column.colnum1 div#detailrightbloc .item_breadcrumb{
    display: flex;
    justify-content: flex-start;
    align-items: center;
    font-size: 10px;
    letter-spacing: 0;
}
#main_column.colnum1 div#detailrightbloc .item_breadcrumb a{
    padding: 0 10px 0 0;
    line-height: 100%;
}
#main_column.colnum1 div#detailrightbloc h2{
    font-weight: normal;
    background-image: none!important;
    font-size: 21px;
    letter-spacing: 0;
    margin: 0;
    padding: 0 0 5px 0;
}
#detailrightbloc ul.status_icon{
    margin-bottom: 0;
    display: flex;
    justify-content: flex-start;
    flex-wrap:wrap;
}
#detailrightbloc ul.status_icon > li{
    float: none;
}
#main_column.colnum1 div#detailrightbloc .item_campaign{
    margin: 0 auto;
    padding: 0 0 10px 0;
    width: 100%;
}
#main_column.colnum1 div#detailrightbloc .item_campaign ul{
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}
#main_column.colnum1 div#detailrightbloc .item_campaign p,
#main_column.colnum1 div#detailrightbloc .item_campaign li{
    font-size: 14px;
    font-weight: 600;
    color: #FF0000;
}
#detailrightbloc .point, #detailrightbloc .relative_cat{
    margin: 0;
    background-image: none!important;
}
#main_column.colnum1 div#detailrightbloc dl.sale_price,
#main_column.colnum1 div#detailrightbloc dl.normal_price,
#main_column.colnum1 div#detailrightbloc dl.giving_point{
    display: flex;
    justify-content: space-between;
    padding: 10px 0;
}
div#detailrightbloc dl.giving_point{
    padding-bottom: 0;
}
#main_column.colnum1 div#detailrightbloc dl.sale_price dt,
#main_column.colnum1 div#detailrightbloc dl.normal_price dt,
#main_column.colnum1 div#detailrightbloc dl.giving_point dt,
#detailrightbloc div.classlist li,
#main_column.colnum1 div#detailrightbloc dl.quantity dt{
    font-size: 14px;
    text-align: left;
}

#main_column.colnum1 div#detailrightbloc dl.sale_price dd,
#main_column.colnum1 div#detailrightbloc dl.normal_price dd,
#main_column.colnum1 div#detailrightbloc dl.giving_point dd{
    text-align: right;
    font-size: 18px;
}
#main_column.colnum1 div#detailrightbloc dl.normal_price dd s{
    font-size: 14px;
}
#main_column.colnum1 div#detailrightbloc dl.normal_price dd em{
    color: #FF0000;
    font-style:normal;
}

/* sagawa, yu packet info */
#detailrightbloc .arrow_box {
    margin: 20px auto 0 auto;
    padding: 5px;
    text-align: center;
    position: relative;
    border: 2px solid #000000;
    border-left: 0;
    border-right: 0;
    border-radius: 0;
    color: #FF0000;
}
.arrow_box:after, .arrow_box:before {
    bottom: 100%;
    left: 50%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
}

#detailrightbloc .arrow_box:after {
    border-color: rgba(255, 255, 255, 0);
    border-bottom-color: #ffffff;
    border-width: 18px;
    margin-left: -18px;
}
#detailrightbloc .arrow_box:before {
    border-color: rgba(0, 0, 0, 0);
    border-bottom-color: #000000;
    border-width: 21px;
    margin-left: -21px;
}
#detailrightbloc .arrow_box span{
    font-weight:600;
}
#detailrightbloc p.att_deliv{
    padding: 10px 0;
    text-align: right;
}
#detailrightbloc p.att_deliv a{
    box-sizing: border-box;
    color: #FF0000;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    font-size: 14px;
    height: 20px;
    line-height: 20px;
    text-decoration: none;
}
#detailrightbloc p.att_deliv a img{
    margin-right: 5px;
}
#detailrightbloc .cart_area {
    padding: 10px 0;
    background-color: transparent;
    border: 0;
}
#detailrightbloc div.classlist {
    padding-bottom: 10px;
    width: 100%;
    background-image: none!important;
}
#detailrightbloc div.classlist ul,
#detailrightbloc div dl.quantity{
    box-sizing: border-box;
    display: flex;
    justify-content: space-between;
    margin: 0 auto;
    padding: 0;
}
#detailrightbloc div dl.quantity{
    padding: 0 0 30px 0;
}
#detailrightbloc div.classlist li,
#detailrightbloc .quantity dt, #detailrightbloc .quantity dd {
    width: 50%;
}
#detailrightbloc dl.dl_social{
    box-sizing: border-box;
    display: flex;
    justify-content: flex-end;
    margin: 0 auto;
    padding: 0;
}
#detailrightbloc dl.dl_social dd{
    padding-left: 5px;
}

#fullcolumn .product_details{
    margin: 0 auto;
    padding: 0;
    background: #e5e5e5;
}

#fullcolumn .product_details .detail_box{
    margin: 0 auto;
    padding: 50px 0;
    width: 980px;
    color: #000;
}
#fullcolumn .product_details .detail_box .box_wrap{
    display: flex;
    justify-content: space-between;
}
#fullcolumn .product_details .detail_box .box_left,
#fullcolumn .product_details .detail_box .box_right{
    width: 465px;
    box-sizing: border-box;
}

#fullcolumn .product_details .detail_box h4{
    border-bottom: 1px solid #000;
    color: #000;
    font-size: 18px;
    font-weight: normal;
    margin: 0 0 30px 0;
    padding: 10px 0;
    text-align: left;
}
#fullcolumn .product_details .detail_box .comment_text{
    padding: 0 0 20px 0;
}

#fullcolumn .product_details .detail_box .box_right dl{
    padding-bottom: 30px;
}
#fullcolumn .product_details .detail_box p,
#fullcolumn .product_details .detail_box .box_right dt,
#fullcolumn .product_details .detail_box .box_right dd{
    margin: 0 auto;
    padding: 0;
    font-size: 14px;
    line-height: 1.4em;
}
#fullcolumn .product_details .detail_box .box_full .dl_toggle dt{
    background: url(/user_data/packages/default/img/products/arrow_down.png) no-repeat center right;
    display:block;
    width:100%;
    height:50px;
    line-height:50px;
    text-align:left;
}
#fullcolumn .product_details .detail_box .box_full .dl_toggle dt.active{
    background: url(/user_data/packages/default/img/products/arrow_up.png) no-repeat center right;
}
#fullcolumn .product_details .detail_box .box_full .dl_toggle dd{
    width:100%;
    height: auto;
    display:none;
}

#undercolumn .detail_img_box{
    margin: 0 auto;
    padding: 20px 0 50px 0;
    width: 980px;
    text-align: center;
    line-height: 0;
}
#undercolumn .detail_img_box img{
    margin: 0 auto;
    width: 100%;
}

#undercolumn .detail_img_box video{
    box-sizing: content-box;
    margin: 50px auto;
    padding: 0;
    width: 100%;
    height: auto;
    display: block;
}

#customervoice_area{
    margin: 0 auto;
    padding: 50px 0;
    width: 980px;
}
#customervoice_area h2.oswald.title{
    background-image: none;
    border-top: 0;
    font-size: 21px;
    text-align: left;
}
div#customervoice_area .review_bloc{
    background-color: transparent;
    display: flex;
    justify-content: flex-start;
}
div#customervoice_area ul{
    padding-bottom: 10px;
}
div#customervoice_area ul li{
    background-image: none!important;
    border-bottom: 1px solid #ccc;
}

div#customervoice_area ul li .review_wrap,
div#customervoice_area ul li dl{
    display: flex;
    justify-content: flex-start;
}
div#customervoice_area ul li .review_wrap h4{
    border-left: 5px solid #ccc;
    font-size: 16px;
    font-weight: normal;
    line-height: 21px;
    padding: 0 18px;
}
div#customervoice_area ul li .review_wrap p.voicedate{
    font-size:12px;
    font-weight: normal;
    line-height: 21px;
    padding: 0;
}
div#customervoice_area ul li dt{
    max-width: 150px;
}
div#customervoice_area ul li dt img{
    margin: 0 20px 20px 20px;
    max-width: 130px;
}
div#customervoice_area ul li p.voicecomment{
    padding: 18px 0 0 5px;
}
/* mypage */
div#mypagecolumn h2.title{
    font-family: Oswald, sans-serif;
    font-size: 24px;
    text-align: left;
    border-bottom: 3px solid #000;
}

div#complete_area .message, div#undercolumn_entry .message {
    margin: 20px 0;
    line-height: 150%;
    font-size: 14px;
    color: #000;
}

div#mynavi_area .mynavi_list{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}
div#mynavi_area .mynavi_list li {
    margin: 0;
    padding: 10px 0;
    text-align: center;
    background: #ccc;
    width: 20%;
}
div#mynavi_area .mynavi_list li:hover,
div#mynavi_area .mynavi_list li.selected{
    background: #ddd;
}
div#mynavi_area .mynavi_list li a{
    font-size: 14px;;
    display: inline-block;
    margin: 0;
    padding: 0 0 0 30px;
    background: url(../img/icon/mypage_nav_arrow.png) no-repeat left center;
}
div#mynavi_area div.point_announce{
    margin-bottom: 10px;
    padding: 10px 0;
    border: 0;
    background-color: transparent;
}
div#mynavi_area div.point_announce p{
    padding-left: 0;
    background: url();
    color: #000;
}
.pagenumber_area{
    background: url();
    padding-bottom: 0;
}
div#mypagecolumn .item_link h3{
    font-weight: normal;
    font-size: 12px;
    border-bottom: 0;
    margin: 0 auto;
    padding: 0;
}
div#mypagecolumn div.paging:after{
    content: " ";
    width: 100%;
    height: 20px;
    display: inline-block;
    clear: both;
}
/* Shopping */
div#undercolumn_cart .point_announce {
    padding: 20px;
    margin-bottom: 20px;
    border: 0;
    background: #fae3dd;
    font-size: 120%;
    text-align: center;
    line-height: 140%;
}
#address_area .add_multiple {
    padding: 15px 10px;
    border: 0;
    float: right;
    width: 30%;
    color: #555;
    background: #eee;
    text-align: center;
    font-weight: bold;
}

div#mypagecolumn .item_wrap{
    justify-content: flex-start;
}

div#mypagecolumn .item_wrap .item_box{
    margin-left: 10px;
    margin-right: 10px;
}
div#mypagecolumn .item_wrap .item_box:first-child,
div#mypagecolumn .item_wrap .item_box:nth-child(5n){
    margin-left: 0;
}

div#mypagecolumn .item_wrap .item_box:last-child,
div#mypagecolumn .item_wrap .item_box:nth-child(4n){
    margin-right: 0;
}

/* RANKING */
#fullcolumn_02 h2.h2_ranking{
    margin: 0 auto;
    padding: 0;
    width: 100%;
    height: 400px;
    background: url(../img/products/h2_ranking.jpg) repeat-x top center;
    background-size: auto 100%;
}

div#ranking_page{
    margin: 0 auto;
}
div#ranking_page h3{
    font-size: 21px;
    text-align:center;
    border-bottom: 0;
    padding-bottom: 50px;
}
div#ranking_page div.item_wrap.wrap_ranking,
div#ranking_page ol{
    margin: 20px auto;
    width: 1200px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

div#ranking_page div.item_wrap.wrap_ranking::after,
div#ranking_page ol::after{
    content:"";
    display: block;
    width:285px;
}

div#ranking_page div.item_wrap.wrap_ranking .item_box,
div#ranking_page ol > li{
    display: flex;
    flex-direction: column;
    margin: 0;
    width: 285px;
    height: 580px;
    position: relative;
}

div#ranking_page div.item_wrap.wrap_ranking .item_box:nth-child(1),
div#ranking_page div.item_wrap.wrap_ranking .item_box:nth-child(2),
div#ranking_page div.item_wrap.wrap_ranking .item_box:nth-child(3),
div#ranking_page ol > li:nth-child(1),
div#ranking_page ol > li:nth-child(2),
div#ranking_page ol > li:nth-child(3){
    width: 380px;
    height; 680px;
}


div#ranking_page div.item_wrap.wrap_ranking .item_box .icon_fav,
div#ranking_page ol > li + a{
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 30px;
}

div#ranking_page div.item_wrap.wrap_ranking .item_box a.item_link,
div#ranking_page ol > li a.item_link{
    position: relative;
    top: 50px;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 90;
}
div#ranking_page div.item_wrap.wrap_ranking .item_box a .listphoto,
div#ranking_page ol > li > a dt{
    margin-top: 0;
}
div#ranking_page div.item_wrap.wrap_ranking .item_box a .listphoto img,
div#ranking_page ol > li > a dt img{
    margin-top: 0;
    width: 285px;
}
div#ranking_page div.item_wrap.wrap_ranking .item_box:nth-child(1) a .listphoto img,
div#ranking_page div.item_wrap.wrap_ranking .item_box:nth-child(2) a .listphoto img,
div#ranking_page div.item_wrap.wrap_ranking .item_box:nth-child(3) a .listphoto img,
div#ranking_page ol > li:nth-child(1) > a dt img,
div#ranking_page ol > li:nth-child(2) > a dt img,
div#ranking_page ol > li:nth-child(3) > a dt img{
    width: 380px;
}
div#ranking_page div.item_wrap.wrap_ranking .item_box a .listphoto,
div#ranking_page ol > li > a dd{
    padding: 10px 0;
}

div#ranking_page div.item_wrap.wrap_ranking .item_box a p.rank_icon,
div#ranking_page li a p.rank_icon{
    position: absolute;
    top: -50px;
    left: 0;
    z-index: 201;
}
div#ranking_page div.item_wrap.wrap_ranking .item_box a p.rank_icon img,
div#ranking_page li a p.rank_icon img{
    height: 32px;
}

div#ranking_page div.item_wrap.wrap_ranking .item_box:nth-child(1) a p.rank_icon img,
div#ranking_page div.item_wrap.wrap_ranking .item_box:nth-child(2) a p.rank_icon img,
div#ranking_page div.item_wrap.wrap_ranking .item_box:nth-child(3) a p.rank_icon img,
div#ranking_page ol > li:nth-child(1) a p.rank_icon img,
div#ranking_page ol > li:nth-child(2) a p.rank_icon img,
div#ranking_page ol > li:nth-child(3) a p.rank_icon img{
    height: 55px;
}
div#ranking_page div.item_wrap.wrap_ranking .item_box .icon_fav,
div#ranking_page ol > li .icon_fav{
    margin: 0;
    padding: 0;
    position: absolute;
    top: 10px;
    bottom: 500px;
    right: 5px;
    z-index: 100;
    width: 100%;
    text-align: right;
}

/* -----------------
topics contents
------------------- */
#topics_column{
    margin: 0 auto;
    padding: 0;
    width: 100%;
    max-width: 980px;
    min-height: 400px;
}

/* -----------------
shoplist
------------------- */
#shoplist_column{
    margin: 0 auto;
    padding: 0;
    width: 100%;
    max-width: 1200px;
    min-height: 400px;
}
#shoplist_column h2{
    border-bottom: 3px solid #000;
    font-size: 24px;
    text-align: left;
}
#shoplist_column p{
    padding: 1em 0;
}
#shoplist_column nav.pref_list{
list-style-type: none;
display: flex;
flex-direction: row;
justify-content: space-between;
}
#shoplist_column nav.pref_list dl{
    width: 12.5%;
}
#shoplist_column nav dt{
    background: url(/user_data/packages/default/img/shoplist/shop_arrow_down.png) no-repeat left 5px;
    text-align: left;
    padding-left: 1.2em;
    position: relative;
    width: 100%;
}
#shoplist_column nav dd{
    flex-direction: column;
    box-sizing: border-box;
    display: none;
    z-index:99;
    margin: 0;
    padding:10px 0 0 0;
    width: 100%;
    -webkit-transition: all .2s ease;
    transition: all .2s ease;
}
#shoplist_column nav dd > ul{
    background: url();
    color: #000;
    width:100%;
    float:inherit;
    margin: 0;
    padding: 0;
    text-align: left;
    display: flex;
    flex-wrap:wrap;
    justify-content: space-between;
}
#shoplist_column nav dd > ul li a{
    display:block;
    padding:4px 0;
    margin: 0;
    text-decoration:none;
}
#shoplist_column nav dd > ul li a:hover{
    color: #ff2d86;
}

#shoplist_column section{
    margin: 0 auto;
    max-width: 980px;
    padding-top: 40px;
}

#shoplist_column section h3{
    background: #eee;
    border-bottom: 0;
    color: #000;
    font-weight: normal;
    padding-left: 1em;
}
#shoplist_column section table{
    width: 100%;
    border: 0;
}
#shoplist_column section table th,
#shoplist_column section table td{
    border-top: 0;
    border-bottom: 1px solid #000;
    border-left: 0;
    border-right: 0;
    background: transparent;
    font-size: 0.8em;
}

#shoplist_column section table th{
    width: 310px;
}
#shoplist_column section table td.shop_map{
    width: 10px;
}
#shoplist_column section table td.shop_zip{
    width: 100px;
}
#shoplist_column section table td.shop_address a{
    text-decoration: underline;
}
#shoplist_column section table td:last-child{
    background: url(/user_data/packages/default/img/shoplist/shop_phone_icon.png) no-repeat left center;
    padding-left: 1.5em;
}



/*
  error message
*/
div#undercolumn_error {
    width: 100%;
    margin: 0 auto;
    padding: 0;
}

/*
tooltip
*/
[data-toggle="tooltip"],
[data-tooltip] {
    position: relative;
}

[data-toggle="tooltip"]:after,
[data-tooltip]:after {
    content: attr(data-tooltip);
    position: absolute;
    display: block;
    left: 0;
    padding: 4px;
    background-color: #FFF;
    background: #FFF;
    border: 1px solid #000;
    color: #000;
    white-space: nowrap;
    z-index: 9999;
    font-size: 0.78em;

    opacity: 0;
    transition-delay: 200ms;
    bottom: -4em;
    visibility: hidden;
}

[data-toggle="tooltip"]:hover:after,
[data-tooltip]:hover:after,
[data-tooltip]:active:after,
[data-tooltip]:focus:after {
    opacity: 1.0;
    transition-delay: 200ms;
    bottom: -3em;
    visibility: visible;
    z-index: 9999;
}

div#ranking_page ol > li [data-tooltip]:after,
div.list_area [data-tooltip]:after{
    right: 0;
    text-align: center;
}

div#ranking_page ol > li [data-tooltip]:after{
    top: 1.6em;
    bottom: 0;
    left: 30%;
    height: 1.6em;
    background: #FFF;
    z-index: 9999;
}

div#mypagecolumn div.list_area [data-tooltip]:after{
    display: block;
    width: 240px;
    left: -240px;
    right: 0;
    text-align: center;

}