@charset "UTF-8";

@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400..700&display=swap');

/* thin=100 / exlight=200 / light=300 / Regukar=400 / Medium=500 / SemiBold=600 / bold=700 / ExBold=800 / Black=900 */

/* --- common --- */
body{
    padding:0;
}
* {
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
}
:target {
  scroll-margin-top: 40px;
}

/* --- AUTOBACS　MAGAZINE --- */
html{
    background-color:#FFFAF7;
}
#ab7v, #abmag{
    width:100%;
    height:100%;
    margin:0;
    padding:0;
    font-family: "Noto Sans JP", "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", sans-serif;
    font-optical-sizing: auto;
    background-color:#FFFAF7;
    color:#333333;
    font-weight:normal;
    font-style:normal;
}

a, span {
    font-weight:inherit;
}

a:link {
    color: #333;
    text-decoration: none;
    opacity:1;
    transition: 0.3s ease;
}
a:visited {
    color: #333;
    opacity:1;
    text-decoration: none;
}
a:hover {
    color: #333;
    text-decoration: none;
    opacity:0.7;
    transition: 0.3s ease;
}
a:active {
    color: #333;
    opacity:1;
    text-decoration: none;
}

.txLink{
    font-size:15px;
    font-weight:400;
}
.txLink a{
    color:#1E77C9;
    text-decoration:none;
    /*text-decoration:underline;
    text-underline-offset: 3px; */
}
.linkLeft {
    background-image: url("/magazine/_img_bg/icon_link_left.svg");
    background-repeat:no-repeat;
    background-size:15px;
    background-position:left center;
    padding-left:1em;
    border-bottom:1px solid #1E77C9;
}
.linkRight{
    background-image: url("/magazine/_img_bg/icon_link_right.svg");
    background-repeat:no-repeat;
    background-size:15px;
    background-position:right center;
    padding-right:1em;
    border-bottom:1px solid #1E77C9;
}

.mgnt1em{
    margin-top:1em;
}


/* --- 記事詳細の各デフォルトの定義 --- */
.ttl1df{
    font-size:25px;
    font-weight:700;
    margin-bottom:40px;
    line-height:1.5;
}
.ttl2df{
    font-size:25px;
    font-weight:400;
    margin-bottom:24px;
}
.ttl3df{
    font-size:21px;
    font-weight:400;
    margin-bottom:16px;
}
.ttl4df{
    font-size:17px;
    font-weight:400;
    margin-bottom:16px;
}
.txMdf{
    font-size:17px;
    font-weight:400;
    margin-bottom:24px;
    line-height:1.6;
}
.txSdf{
    font-size:15px;
    font-weight:400;
}
.txSSdf{
    font-size:13px;
    font-weight:400;
}
.mgb40{
    margin-bottom:40px;
}
.mgb80{
    margin-bottom:80px;
}
.eachBlocks{
    margin-bottom:40px;
}
.eachBlocksEX{
    margin-bottom:20px;
}

/* --- 装飾 --- */
.underDotOrgred{
    text-decoration-line: underline;
    text-decoration-thickness: 2px;
    text-decoration-style: dotted;
    text-decoration-color: #E67F38;
    text-underline-offset: 5px;
    line-height:1.8;
}

/* --- カテゴリカラー --- */
.col_perfect-craft{
    color:#9A09D9;
}
.col_motorsports{
    color:#529F39;
}
.col_entertainment{
    color:#D03C6C;
}
.col_specific-maint{
    color:#523C7A;
}

/* --- 旧カテゴリ */
.col_for-mania{
    color:#D03C6C;
}
.col_funny{
    color:#529F39;
}
.col_events{
    color:#DC4027;
}
.col_car-topics{
    color:#523C7A;
}


/* --- テキストリンク --- */
.ABMlinkTx a{
    color:#1E77C9;
}
.ABMlinkTx a:link{
    font-size:17px;
    color:#1E77C9;
    text-decoration: none;
    opacity:1;
    transition: 0.3s ease;
}
.ABMlinkTx a:visited {
    color: #1E77C9;
    text-decoration: none;
}
.ABMlinkTx a:hover {
    color: #1E77C9;
    text-decoration: underline;
    opacity:0.7;
    transition: 0.3s ease;
}
.ABMlinkTx　a:active {
    color: #f00;
    text-decoration: none;
    opacity:1;
}
.open_selfIcon:after {
	content: " ▸";
}
.open_blankIcon{
    padding-right:20px;
    background-image: url("/magazine/_img_bg/icon_openLink.svg");
    background-repeat:no-repeat;
    background-position:center right;
    background-size: 20px 20px;
}

/* --- メインエリア --- */
#abmag {
    width:1200px;
    margin:0 auto;
    position:relative;
    z-index:5;
    line-height:1.5;
}
.abmagMain{
    width:688px;
    padding:80px;
    margin-left:416px;
    background-color:#FFFFFF;
    min-height:50vh;
    
}
.abmagMain img{
    vertical-align:bottom;
}
.innerLink:after {
    content: url("/magazine/_img_bg/icon_link.svg");
    display: inline-block;
    height: 24px;
    width: auto;
    vertical-align: middle;
    padding-left:0.3em;
}
.outLink:after {
    content: url("/magazine/_img_bg/icon_openLink.svg");
    display: inline-block;
    height: 24px;
    width: auto;
    vertical-align: middle;
    padding-left:0.3em;
}

/* --- 記事画像 --- */
.fullwideImg{
    width:526px;
    height:395px;
    text-align:center;
    background-color:#f7f7f7;
}
.thumbImg{
    width:233px;
    height:175px;
    text-align:center;
    background-color:#f7f7f7;
}
.fullwideImg img,
.thumbImg img{
    max-width:100%;
    max-height:100%;
    margin:auto;
}




@media screen and (max-width: 1119px) {    
    #abmag {
        width:100%;
        overflow:hidden;
    }
}


.envNote{
    position:absolute;
    top:0;
    left:0;
    font-size:13px;
    color:#ff0;
    width:100%;
    text-align:center;
}
/* --- header --- */
.abmagHeader{
    width:100%;
    padding:0;
    position:fixed;
    top:0;
    z-index:-1;
}
 .headerCatch{
    position:absolute;
    top:0;
    left:0;
    width:416px;
    background-color:#E67F38;
    padding-bottom:16px;
    height:97vh;
}
.headerCatch .ttl01img{
    padding-top:9vh;
    text-align:center;
}
.headerCatch .ttl01img .h1imgPc{
    display:block;
    width:368px;
    vertical-align:bottom;
    margin:0 auto 3vh;
}
.headerCatch .ttl01img .h1imgSp{
    display:none;
}

.headerCatch .categoList{
    background-color:#FFFAF7;
    border-radius:16px;
    width:340px;
    margin:0 auto;
    padding:2.5vh 40px;
    display: flex;
    justify-content: center; 
    flex-wrap: wrap;
    font-size:15px;
}
.headerCatch .categoList li{
    display:block;
    white-space:nowrap;
    margin:0.5em 0.7em;
    padding-bottom:1px;
    /* border-bottom: 2px dotted #E67F38; */
}
.headerCatch .categoList li a{
    border-bottom: 2px dotted #E67F38;
}

.headerCatch .categoList .koko a{
    color:#C95102;
    font-weight:700;
    border-bottom: none;
}

.headerCatch .categoList .div02{
    background-image: url("/magazine/_img_bg/icon_crown.svg");
    background-repeat: no-repeat;
    background-position:left center;
    background-size:21px;
    padding-left:1.4em;
}
.headerCatch .categoList .crown{
    background:url("/magazine/_img_bg/icon_rank.svg") no-repeat left center;
    background-size: 21px auto;
    padding-left:22px;
}

/* --- メニューボタンと開閉メニュー--- */
.abmagHeader .menuButtonWrapp{
    position:fixed;
    top:40px;
    left:0;
    width:100%;
    height:60px;
    margin:0 auto;
    z-index:0;
}
.menuButtonWrapp .menuButton{
    width:1185px;
    margin:0 auto;
    box-sizing: border-box;
    padding:0 24px 0 0;
    position:relative;
}
.menuButtonWrapp .menuButton .burgerBtn{
    width:60px;
    height:60px;
    margin:0;
    /* cursor:context-menu; */
    cursor:pointer;
    position: absolute;
    top:0;
    right:0;
    border-radius:60px;
    background-color:#E67F38;
}
.menuButtonWrapp .menuButton span {
    display: block;
    position: absolute;
    top:23px;
    left: 20px;
    width: 20px;
    height: 2px;
    background-color: #fff;
    border-radius: 2px;
    transition: all .5s;
}
.menuButtonWrapp .menuButton span:nth-child(1) {
    top: 29px;
}
.menuButtonWrapp .menuButton span:nth-child(2) {
    top: 35px;
}

/*
.abmagHeader .menuButton .forSPbtn{
    display:none;
}
.abmagHeader .menuButton .forPCbtn{
    width:64px;
    margin:0;
    vertical-align:bottom;
    cursor:context-menu;
}
*/

/* --- モーダルメニュー --- */
#menuBackMask {
	background: #E67F38;
 	display: none;
	height: 100%;
	left: 0px;
    opacity: 0.9;
	position: fixed;
	top: 0;
	width: 100%;
	z-index: 10;
    /* cursor:zoom-out; */
    cursor:alias;
}
#menuWin{
	display: none;
	top: 0;
	left: 0;
	margin: 0;
	padding: 0;
	height: 0;
    position: relative;
	width: 100%;
	z-index: 11;
}
#MenuBox{
    position:fixed;
    top:40px;
    right:60px;
    width:490px;
    height:auto;
    box-sizing:border-box;
    max-height:calc(100vh - 80px);;
    min-height:30vh;
    overflow:auto;
    border-radius:32px;
    background-color:#FFFAF7;
    padding:40px;
    z-index: 12;
}
.closeBtn{
    position:absolute;
    top:20px;
    right:20px;
    width:24px;
    height:24px;
    background-image: url("/magazine/_img_bg/icon_close.svg");
    background-size: 24px 24px;
    background-position:0 0;
    background-repeat: no-repeat;
    cursor:pointer;
}
.ctgMenu{
    padding:0 0 25px 0;
    border-bottom:1px solid #CDCDCD;
    margin-bottom:40px;
}
.ctgMenu .ttl03{
    font-size:15px;
    font-weight:400;
    color:#C95102;
    margin-bottom:1.2em;
}
.ctgMenu li{
    font-size:17px;
    font-weight:400;
    margin-bottom:1em;
}
.ctgMenu a{
    display:inline-block;
    font-size:17px;
    font-weight:400;
    color:#333;
    line-height:1.6;
    opacity:1;
    transition: 0.3s ease;
}
.ctgMenu a:after{
    content: url("/magazine/_img_bg/icon_link.svg");
    display: inline-block;
    height: 24px;
    width: 12px;
    vertical-align: middle;
    padding-left:0.2em;
}
.ctgMenu a:hover{
    /* text-decoration: underline; */
    opacity:0.6;
    transition: 0.3s ease;
}

/* --- モーダルメニュー検索絞り込みフォーム --- */
.searchBox{
    margin-bottom:1.2em;
}
.searchBox .ttl03{
    font-size:15px;
    font-weight:400;
    color:#C95102;
    margin-bottom:1.2em;
}
.searchParts{
    width:100%;
    margin:0;
    padding:0;
    white-space:nowrap;
    box-sizing:border-box;
}
.searchParts .fldQstr{
    width:350px;
    height:45px;
    margin:0 5px 0 0;
    box-sizing:border-box;
}
#karappo{
    font-size:13px;
    color:#C95102;
    margin-top:5px;
}
.kwdBlock{
    margin:0;
    padding:0;
    display:flex;
    flex-wrap: wrap;
    justify-content: left; 
    gap: 16px 16px;
}   
.kwdBlock li{
    list-style-type:none;
}
.kwdBlock li a{
    display:block;
    color:#666;
    font-weight:700;
    text-decoration:none;
    opacity:1;
    transition: 0.3s ease;
    border:1px solid #FDD0B2;
    white-space:nowrap;
    background-color:#fff;
    font-size:14px;
    line-height:1;
    padding:0.5em 0.7em;
    border-radius:2em;

}
.kwdBlock li a:hover{
    text-decoration:none;
    opacity:0.5;
    transition: 0.2s ease;
}
.kwdBlock li a.koko{
    font-weight:700;
    color:#cdcdcd;
}
.kwdBlock .moreBtn{
    border:none;
    cursor:pointer;
    margin-left:0.5em;
    padding-left:1.2em;
    background:url("../_img_bg/icon_open.svg") left center no-repeat;
    background-size:15px 15px;
    font-size:15px;
    line-height:1.7;
}
.schCarMdl{
    font-size:15px;
    font-weight:400;
    padding-top:1.5em;
}
#abmag .schCarMdl a,
#menuWin .schCarMdl a{
    font-size:15px;
    color:#1E77C9;
    text-decoration:underline;
    text-underline-offset: 3px;
}


.dispFlex{
    display:flex;
    opacity:1;
    transition: 0.3s ease;
}
.kwdMoreBlock{
    margin:16px 0 0 0;
    padding:0;
    flex-wrap: wrap;
    justify-content: left; 
    gap: 16px 16px;
    font-weight:700;
}
.kwdMoreBlock li{
    list-style-type:none;

}
.kwdMoreBlock li a{
    display:block;
    color:#666;
    font-weight:700;
    text-decoration:none;
    opacity:1;
    transition: 0.3s ease;
    border:1px solid #FDD0B2;
    white-space:nowrap;
    background-color:#fff;
    font-size:14px;
    line-height:1;
    padding:0.5em 0.7em;
    border-radius:2em;
}
.kwdMoreBlock li a:hover{
    text-decoration:none;
    opacity:0.5;
    transition: 0.2s ease;
}
.bacicLinkBlock{
    margin:40px 0 0 0;
    padding:40px 0 0 0;
    border-top:solid 1px #cdcdcd;
}
.bacicLinkBlock .ttl03{
    width:170px;
    height:24px;
}
.bacicLinkBlock .ttl03 img{
    width:100%;
}
.bacicLinks{
    list-style:none;
    font-size:16px;
    margin:0;
    padding:0;
}
.bacicLinks li{
    margin:24px 0 0 0;
    padding:0;
}   
.bacicLinks li a{
    color:#333;
    font-weight:400;
    text-decoration:none;
    opacity:1;
    transition: 0.3s ease;
}

/* --- form部品 --- */
form input[type=text],
form textarea{
    font-size:16px;
    background-color: #fff;
    color: #333;
    border:1px #FDD0B2 solid;
    padding:0.5em;
    border-radius: 4px;
    line-height:17px;
    box-sizing: border-box;
}
.submitBtn1{
    width:45px;
    height:45px;
    margin:0;
    padding:0;
    box-sizing: border-box;
    border-radius: 4px;
    border:1px solid #FDD0B2;
    font-size:17px;
    text-align:center;
    color:#333;
    cursor:pointer;
    background-color:#fff;
    background-image: url("../_img_bg/Icon_search.svg");
    background-repeat: no-repeat;
    background-position: center center ;
    background-size:1.3em auto;
}
.submitBtn1:hover{
    opacity:0.75;
}
::-webkit-input-placeholder {
    color: #999;
    font-size:95%;
}
::-moz-placeholder{
    color: #999;
    font-size:95%;
}
:-ms-input-placeholder {
    color: #999;
    font-size:95%;
}
:placeholder-shownr {
    color: #999;
    font-size:95%;
}

/* --- ページ内検索絞り込みフォーム --- */
.searchBlock{
    margin-bottom:80px;
}
.searchBlock .ttl03{
    font-size:33px;
    line-height:1.2;
    padding-bottom:0.2em;
    font-weight:400;
    color:#C95102;
    border-bottom :5px solid #C95102;
    margin-bottom:40px;
}
.searchBlock .ttl03b{
    font-size:17px;
    font-weight:400;
    color:#C95102;
    margin-bottom:16px;
    background-image: url("../_img_bg/icon_eye.svg");
    background-repeat: no-repeat;
    background-position: left center ;
    background-size:1.3em auto;
    padding-left:1.5em;
}
.searchForm{
    padding-bottom:16px;
}
.searchForm .fldQstr2{
    width:470px;
    height:45px;
    margin:0 8px 0 0;
}
#karappo2{
    font-size:13px;
    color:#C95102;
    margin-top:5px;
}
.kwdMoreBlock2{
    margin:16px 0 0 0;
    padding:0;
    flex-wrap: wrap;
    justify-content: left; 
    gap: 16px 16px;
}
.kwdMoreBlock2 li{
    list-style-type:none;
    white-space:nowrap;
    border:1px solid #FDD0B2;
    background-color:#fff;
    font-size:14px;
    line-height:1;
    padding:0.5em 0.7em;
    border-radius:2em;
}
.kwdMoreBlock2 li a{
    color:#000;
    text-decoration:none;
    opacity:1;
    transition: 0.3s ease;
}
.kwdMoreBlock2 li a:hover{
    text-decoration:none;
    opacity:0.5;
    transition: 0.2s ease;
}

/* --- footer ----------------------- */
#abmagFooter{
    width:688px;
    margin-left:416px;
    background-color:#FFFAF7;
}
.footerBlock{
    width:100%;
    margin:0;
    padding-bottom:80px;
    background-color:#fff;
}
.footerBlock .inner{
    padding:40px 80px 80px;
    background-image: url("../_img_bg/footer_character.png");
    background-repeat: no-repeat;
    background-position: right 80px bottom 80px;
    background-size:175px auto;
}
.footerBlock .sokomade{
    width:220px;
    margin-bottom:40px;
}
.copyTx{
    font-size:15px;
    font-weight:normal;
    color:#666;
    padding-left:80px;
    text-align:left;
}
.copyTx a{
    color:#666;
    text-decoration:underline;
}

/* --- パンクズ --- */
.breadcrumb{
    width:100%;
    background-color: #F2F2F2;
    border-bottom:8px solid #E67F38;
    width:100%;
    margin:0 auto;
    display: flex;
    flex-wrap: wrap;
    list-style: none;
    line-height:2;
    overflow:hidden;
    padding:0.8em;
}
.breadcrumb li{
    font-size:12px;
    color:#555;
}
.breadcrumb li a:link {color: #666;text-decoration: none;}
.breadcrumb li a:visited {color: #666;text-decoration: none;}
.breadcrumb li a:hover {color: #666;text-decoration: none;opacity:0.7;}
.breadcrumb li a:active {color: #666;text-decoration: none;}

.breadcrumb li a:after {
    content: "\276f";
    font-weight:400;
    padding:0 0.8em;
    font-size:12px;
    color:#aaa;
}

/* --- フッターのカテゴリ --- */
.footerCtg{
    list-style: none;
}
.footerCtg .each{
    font-size:17px;
    font-weight:400;
    color:#333;
    margin-bottom:1em;
}
.footerCtg .each a{
    font-weight:400;
    color:#333;
    text-decoration:none;
}
.footerCtg .each a:after {
    content: "\276f";
    font-weight:400;
    padding:0 0.5em;
    font-size:17px;
    color:#E67F38;
}

.each.koko a{
    color:#C95102;
    font-weight:700;
    border-bottom: none;
}

/* --- scrollアニメ --- */
.scrollbarAnime{
    position:fixed;
    bottom:0;
    margin:0 0 0 720px;
    height: 100px;
    z-index:3;
}
.scrollbarText {
  position: absolute;
  top: 0;
  left:10px;
}
.scrollbarText  img{
    height:60px;
}
.scrollbarVertical {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: 1px;
}
.scrollbarVertical::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 2px;
  height: 100px;
  background: #E67F38;
  animation: liner 3s cubic-bezier(1, 0, 0, 1) infinite;
}
@keyframes liner {
  0% {
    transform: scale(1, 0);
    transform-origin: 0 0;
  }
  30% {
    transform: scale(1, 1);
    transform-origin: 0 0;
  }
  70% {
    transform: scale(1, 1);
    transform-origin: 0 100%;
  }
  100% {
    transform: scale(1, 0);
    transform-origin: 0 100%;
  }
}

/* --- ページネーション --- */
.Pagination{
    text-align:center;
    margin:0;
    padding:0;
}
.mbex{
    margin-bottom:80px;
}
.pgNavKT{
    margin:0;
    padding:0;
    list-style:none;
    display:flex;
    justify-content: center; 
}
.pgNavKT li{ 
    font-size:16px;
    font-weight:400;
    white-space:nowrap;
    text-align:center;
    width:3em;
    height:1.3em;
    line-height:1.3em;
    border-left:1px solid #999;
    display:flex;
    justify-content: center; 
    align-items: center; 
    color:#999;
}
.pgNavKT li img{ 
    width:34px;
    vertical-align:center;
}
.pgNavKT li.dot{
    color:#999;
} 
.pgNavKT .nowHere{
    color:#999;
    text-decoration: underline #aaa;
    text-decoration-thickness: 2px;
} 
.pgNavKT li.first,
.pgNavKT li.prev,
.pgNavKT li.p1,
.pgNavKT li.next
{
    border-left:none;
}
.notFoundMsg{
    width:90%;
    font-size:15px;
    color:#777;
    padding:2em 0.5em;
    border:1px solid #ccc;
    border-radius:7px;
    margin:30px auto;
    text-align:center;
}


/* --- SP ----------- */
@media screen and (max-width:768px){

    /* --- 記事詳細の各デフォルトの定義 --- */
    .ttl1df{
        font-size:5.87vw;
        font-weight:400;
        margin-bottom:10vw;
    }
    .ttl2df{
        font-size:5.6vw;
        font-weight:400;
        margin-bottom:6.4vw;
    }
    .ttl3df{
        font-size:4.8vw;
        font-weight:400;
        margin-bottom:6.4vw;
    }
    .ttl4df{
        font-size:4.53vw;
        font-weight:400;
        margin-bottom:4.2vw;
    }
    .txMdf{
        font-size:4.53vw;
        font-weight:400;
    }
    .txSdf{
        font-size:4vw;
        font-weight:400;
    }
    .txSSdf{
        font-size:3.5vw;
        font-weight:400;
    }
    .mgb40{
        margin-bottom:10vw;
    }
    .mgb80{
        margin-bottom:21vw;
    }
    .eachBlocks{
        margin-bottom:10vw;
    }
    .eachBlocksEX{
        margin-bottom:5.3vw;
    }


    /* --- テキストリンク --- */
    .ABMlinkTx a{
        color:#1E77C9;
    }
    .ABMlinkTx a:link{
        font-size:4.5vw;
    }
    .open_blankIcon{
        padding-right:5vw;
        background-size: 5vw 5vw;
    }

    /* --- メインエリア --- */
    #abmag {
        width:100%;
        margin:0 auto;
        overflow:hidden; 
    }
    .abmagMain{
        position:static;
        z-index:auto;
        width:100%;
        height:auto;
        margin:0;
        padding:0;
        box-sizing:border-box;
    }
    
    .scrollbar {
        -ms-overflow-style: none;
        scrollbar-width: none;
    }
    
    .scrollbar::-webkit-scrollbar {
        display: none;
    }

    /* --- 記事画像 --- */
    .fullwideImg{
        width:87.2vw;
        height:65.3vw;
        text-align:center;
        background-color:#f7f7f7;
    }
    .thumbImg{
        width:27.5vw;
        height:20.5vw;
        text-align:center;
        background-color:#eee;
        border-radius:8px;
        overflow:hidden;
    }
    .fullwideImg img,
    .thumbImg img{
        max-width:100%;
        max-height:100%;
        margin:auto;
    }

    .envNote{
        font-size:3vw;
        color:#33a;
    }
    /* --- header --- */
    .abmagHeader{
        width:100%;
        position:static;
    }
    .headerCatch{
        position:static;
        width:100%;
        padding-bottom:0;
        height:auto;
    }
    .headerCatch .ttl01img{
        text-align:left;
        padding:2.2vw 0 2.2vw 1.5vw;
    }
    .headerCatch .ttl01img .h1imgPc{
        display:none;
    }
    .headerCatch .ttl01img .h1imgSp{
        display:block;
        width:auto;
        height:25.5vw;
        vertical-align:bottom;
        margin:0 0 0 0;
    }
    .headerCatch .ttl01img .subTitle{
        position:absolute;
        bottom:2.5vw;
        left:28vw;
        display:block;
        font-size:3.2vw;
        font-weight:400;
        color:#FFFAF7;
    }
    .headerCatch .car-lendar_pc{
        display:none;
    }
    
    .headerCatch .categoList{
        position:static;
        background: linear-gradient(90deg, #ededed 5%, #fdfdfd 95%);
        border-radius:0;
        width:100%;
        height:12vw;
        margin:0;
        padding:4vw 3em 0 0.5em;
        line-height:1;
        display: block;
        white-space:nowrap;
        font-size:4vw;
        overflow-x: scroll;
        border-bottom:1px solid #f0f0f0;
        box-sizing:border-box;
    }
    .categoBox{
        position:relative;
        height:12vw;
        box-sizing:border-box;
    }
    
    .categoBox .mask{
        position:absolute;
        top:0;
        right:0;
        padding:0;
        width:17vw;
        height:12vw;
        background: linear-gradient(90deg, transparent 0%, #fff 90%);
        box-sizing:border-box;
    }
    .headerCatch .categoList li{
        display:inline-block;
        white-space:nowrap;
        margin:0 0.4em;
        padding:0;
        border-bottom: none;
    }
    .headerCatch .categoList li a{
        border-bottom: none;
    }
    .headerCatch .categoList .div02{
        background-image: url("/magazine/_img_bg/icon_crown.svg");
        background-repeat: no-repeat;
        background-position:left center;
        background-size:6vw;
        padding-left:6.5vw;
    }
    
    /* --- メニューボタンと開閉メニュー--- */
    .abmagHeader .menuButtonWrapp{
        position:fixed;
        top:6vw;
        right:5vw;
        left:auto;
        margin:0;
        width:12vw;
        height:12vw;
        z-index:10;
    }
    .abmagHeader .menuButton{
        width:11vw;
        height:11vw;
        margin:0;
        box-sizing: border-box;
        padding:0;
        text-align:center;
    }
    .menuButtonWrapp .menuButton .burgerBtn{
        width:14vw;
        height:14vw;
        margin:0;
        /* cursor:context-menu; */
        cursor:pointer;
        position: absolute;
        top:0;
        right:0;
        border-radius:14vw;
        background-color:#E67F38;
    }
    .menuButtonWrapp .menuButton span {
        display: block;
        position: absolute;
        top:5.5vw;
        left: 4.5vw;
        width: 5vw;
        height: 2px;
        background-color: #fff;
        border-radius: 2px;
        transition: all .5s;
    }
    .menuButtonWrapp .menuButton span:nth-child(1) {
        top: 7vw;
    }
    .menuButtonWrapp .menuButton span:nth-child(2) {
        top: 8.7vw;
    }

/*
    .abmagHeader .menuButtonWrapp .forSPbtn{
        display:block;
        width:100%
    }
    .abmagHeader .menuButtonWrapp .forPCbtn{
        display:none;
    }
*/

/* --- モーダルメニュー --- */
    #menuBackMask {
        background: #000;
        display: none;
        height: 100%;
        left: 0px;
        opacity: 0.9;
        position: fixed;
        top: 0;
        width: 100%;
        z-index: 20;
        cursor:normal;
    }
    #menuWin{
        display: none;
        top: 0;
        left: 0;
        margin: 0;
        padding: 0;
        height: 0;
        position: relative;
        width: 100%;
        z-index: 30;
    }
    #MenuBox{
        position:fixed;
        top:0;
        right:0;
        left:9.5vw;
        width:90.5vw;
        height:100vh;
        box-sizing:border-box;
        max-height:100vh;
        min-height:100vh;
        overflow:auto;
        border-radius:0;
        background-color:#FFFAF7;
        padding:16vw 10vw 25vh;
        z-index: 40;
        border-left:8px solid #E67F38;
    }
    .closeBtn{
        position:fixed;
        top:8.7vw;
        right:9.2vw;
        width:7vw;
        height:7vw;
        background-image: url("/magazine/_img_bg/icon_close.svg");
        background-size: 7vw 7vw;
        background-position:0 0;
        background-repeat: no-repeat;
        cursor:pointer;
    }
    .ctgMenu{
        padding:0 0 5vw 0;
        border-bottom:1px solid #CDCDCD;
        margin-bottom:8vw;
    }
    .ctgMenu .ttl03{
        font-size:4vw;
        font-weight:400;
        color:#C95102;
        margin-bottom:1.2em;
    }
    .ctgMenu li{
        font-size:4.5vw;
        font-weight:400;
        margin-bottom:1.1em;
    }
    .ctgMenu a{
        display:block;
        font-size:4.5vw;
        font-weight:400;
        color:#333;
        line-height:1.6;
        opacity:1;
    }
    .ctgMenu a:after{
        content: url("/magazine/_img_bg/icon_link.svg");
        display: inline-block;
        height: 6.4vw;
        width: 3.2vw;
        vertical-align: middle;
        padding-left:0.1em;
    }
    .ctgMenu a:hover{
        text-decoration: none; 
        opacity:1;
        transition:none;
    }
    .searchBox{
        margin-bottom:1.2em;
    }
    .searchBox .ttl03{
        font-size:4vw;
        font-weight:400;
        color:#C95102;
        margin-bottom:1.2em;
    }
    .searchParts .fldQstr{
        width:52vw;
        height:12vw;
        margin:0 8px 0 0;
    }
    #karappo{
        font-size:3.3vw;
        color:#C95102;
        margin-top:5px;
    }
    .kwdBlock{
        margin:0 0 0 0;
        padding:0 0 0 0;
        display:flex;
        flex-wrap: wrap;
        justify-content: left; 
        gap: 5.5vw 2vw;
    }   
    .kwdBlock li{
        list-style-type:none;
    }
    .kwdBlock li a{
        color:#666;
        text-decoration:none;
        opacity:1;
        font-size:3.5vw;
        font-weight:700;
        white-space:nowrap;
        border:1px solid #FDD0B2;
        background-color:#fff;
        font-size:3.5vw;
        line-height:1;
        padding:0.5em 0.7em;
        border-radius:2em;
    }
    .kwdBlock li a:hover{
        text-decoration:none;
        opacity:1;
    }
    .kwdMoreBlock li a{
        color:#666;
        text-decoration:none;
        opacity:1;
        font-size:3.5vw;
        font-weight:700;
        white-space:nowrap;
        border:1px solid #FDD0B2;
        background-color:#fff;
        font-size:3.5vw;
        line-height:1;
        padding:0.5em 0.7em;
        border-radius:2em;
    }

    .schCarMdl{
        font-size:4vw;
        font-weight:400;
        padding-top:1.5em;
    }
    #abmag .schCarMdl a{
        font-size:4vw;
        color:#1E77C9;
        text-decoration:underline;
        text-underline-offset: 3px;
    }

    .bacicLinkBlock{
        margin:10vw 0 0 0;
        padding:10vw 0 0 0;
    }
    .bacicLinkBlock .ttl03{
        width:46vw;
        height:6.4vw;
    }
    .bacicLinks{
        font-size:4vw;
    }
    .bacicLinks li{
        margin:1.5em 0 0 0;
        padding:0;
    }   
    .bacicLinks li a{
        color:#333;
        font-weight:400;
        text-decoration:none;
        opacity:1;
    }

    /* --- form部品 --- */
    form input[type=text],
    form textarea{
        font-size:16px;
        background-color: #fff;
        color: #333;
        border:1px #FDD0B2 solid;
        padding:0.5em;
        border-radius: 4px;
        line-height:1.2;
        box-sizing: border-box;
    }
    .submitBtn1{
        width:12vw;
        height:12vw;
        margin:0;
        padding:0;
        box-sizing: border-box;
        border-radius: 4px;
        border:1px solid #FDD0B2;
        font-size:4.5vw;
        text-align:center;
        color:#333;
        cursor:pointer;
        background-color:#fff;
        background-image: url("../_img_bg/Icon_search.svg");
        background-repeat: no-repeat;
        background-position: center center ;
        background-size:5vw auto;
    }
    .submitBtn1:hover{
        opacity:1;
    }

    /* --- ページ内検索絞り込みフォーム --- */
/*
    .searchBlock{
        margin:0 auto 21vw;
        width:87vw;
        background-color:#FFFAF7;
    }
*/
    .searchBlock{
        margin:0 auto;
        padding:21vw 6.5vw;
        width:100vw;
        background-color:#FFFAF7;
    }
    .searchBlock .ttl03{
        font-size:8.8vw;
        line-height:1.2;
        padding-bottom:0.2em;
        margin-bottom:10vw;
    }

    .searchBlock .ttl03b{
        font-size:4.5vw;
    }
    /* --- まだ --- */
    
    .searchForm{
        padding-bottom:4.3vw;
    }
    .searchForm .fldQstr2{
        width:72vw;
        height:12vw;
        margin:0 2vw 0 0;
    }
    #karappo2{
        font-size:3.4vw;
        margin-top:0.4em;
    }
    .kwdMoreBlock2{
        margin:16px 0 0 0;
        padding:0;
        flex-wrap: wrap;
        justify-content: left; 
        gap: 16px 16px;
    }

    .mbex{
        margin-bottom:10vw;
    }



    /* --- footer ----------------------- */
    #abmagFooter{
        width:100%;
        margin-left:0;
        background-color:#FFFAF7;
    }
    .footerBlock{
        width:100%;
        margin:0 0 0 0;
        padding-bottom:6.5vw;
        background-color:#FFFAF7;
        border-bottom:8px solid #E67F38;
    }
    .footerBlock .inner{
        padding:10vw 6.4vw 21vw;
        background-position: right 6.4vw bottom 21vw;
        background-size:42vw auto;
    }
    .footerBlock .sokomade{
        width:58vw;
        margin-bottom:10vw;
    }
    .copyTx{
        font-size:4vw;
        padding-left:6.4vw;
    }

    /* --- パンクズ --- */
    .breadcrumb li{
        font-size:3.2vw;
    }
    .breadcrumb li a:after {
        padding:0 0.7em;
        font-size:3.2vw;
    }

    /* --- カテゴリ --- */
    .footerCtg .each{
        font-size:4.5vw;
        margin-bottom:1.2em;
    }
    .footerCtg .each a:after {
        padding:0 0.4em;
        font-size:4.5vw;
    }

    /* --- scrollアニメ --- */
    .scrollbarAnime{
        display:none;
        position:static;
        z-index:auto;
    }


}/* SP */