/*
============================================================
//default
============================================================
*/


.secTopNews .hTitleNews{
    background: #fafafa !important;
}

@media screen and (max-width:770px) { 
	.secTopNews .hTitleNews h2 {
		border-right:none !important;
        outline: none;
        text-align:left;
        margin:0;
        width:100%;
        padding:0;
        color:#222;
	}
    .secTopNews .hTitleNews{
        background: #fafafa !important;
        text-align:left;
    }
    .secTopNews{
        margin:0 !important;
    }
    .secTopNews .entryTopNews a {
        padding:0;
    }
    .secTopNews .entryTopNews time {
        color:#222;
        font-weight:700;
        width:25%;
    }
    .secTopNews .entryTopNews .hlEntryTopNews {
        width:75%;
        margin:0 !important;
    }
}
@media screen and (max-width:499px) { 
    .secTopNews .hTitleNews h2 {
        font-size:0.875rem;
    }
}


.gNav .nav-menu:first-child{
    border-left: 1px solid #f0f0f0;
}
.gNav .nav-menu .nav-item a{
    border-right: 1px solid #f0f0f0;
    font-size:14px !important;
}








#top-main-area{
    display:block;
    width:100%;
    padding:0;
    margin:0;
}

#top-main-area .swiper-slide{
    display:block;
    width:100%;
    padding:0;
    margin:0 auto;
}
#top-main-area .swiper-slide .top-slider-link{
    display:block;
    width:100%;
    padding-bottom:41.6666%;
    position:relative;
}
#top-main-area .swiper-slide .top-slider-link .top-slider-item{
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    background-size:cover;

}

.swiper-buttonArea{
    width:94%;
    max-width:1100px;
    position:absolute;
    top:50%;
    left:50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    z-index:100;
}
.swiper-buttonWrap{
    width:100%;
    position:relative;
}

.swiper-button-next{
    background-image: url('/files/uploads/arrow_white_right.png');
    width:20px;
    height:39px;
    background-size:contain;
}

.swiper-button-prev{
    background-image: url('/files/uploads/arrow_white_left.png');
    width:20px;
    height:39px;
    background-size:contain;
}
.swiper-button-prev:hover,
.swiper-button-next:hover{
    opacity:0.6;
}

@media screen and (max-width:1200px) {
    .swiper-buttonWrap{
        display:none;
    }
}












/*
============================================================
//home->search
============================================================
*/
.search-area{
    position:absolute;
    top:10px;
    width:100%;
    z-index:100;
}
.search-wrapper{
    width:94%;
    max-width:960px;
    display : -webkit-box; 
    display : -webkit-flex; 
    display : -ms-flexbox;
    display : flex;
    justify-content: space-between;
    flex-direction: row;
    flex-wrap: nowrap;
    margin:0 auto;
    padding-top:20px;
}
.top-logoImage{
    width:20.83%;
    height:44px;
    max-width:200px;
}
.top-logoImage img {
    width:100%;
    height:100%;
    object-fit: contain;
}
.searchform{
    display:block;
    width:280px;
    height:44px;
    position:relative;
}
.searchform #SearchIndexQ{
    position:absolute;
    top:50%;
    left:0;
    float: left;
    display: block;
    width: 200px;
    background-color: rgba(255,255,255,0.3);
    color: #222;
    font-family: "Roboto",sans-serif;
    font-size: 12px;
    line-height: 100%;
    border:none;
    border-radius:0px;
    transform: translate(0, -50%);
    -webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);

}
.searchform #SearchIndexQ:active,
.searchform #SearchIndexQ:focus{
    background-color: rgba(255,255,255,0.9);
}
.searchform .submit_button{
    float: left;
    display: block;
    position:absolute;
    top:50%;
    right:0;
    width: 80px;
    height:12px;
    box-sizing:border-box;
    padding: 8px 0;
    border: none;
    background-color: #222;
    color: #ffffff;
    font-family: "Roboto",sans-serif;
    font-size: 12px;
    line-height: 100%;
    text-align: center;
    box-sizing: content-box;
    cursor: pointer;
    border-radius:0px;
    transform: translate(0, -50%);
    -webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
}

@media screen and (max-width:1110px) {
    .search-area{
        position:static;
        background:#eee;
    }
    .top-logoImage{
        display:none;
    }
    .searchform{
        display:block;
        width:240px;
        height:44px;
        position:relative;
        margin:0 auto;
        display : -webkit-box; 
        display : -webkit-flex; 
        display : -ms-flexbox;
        display : flex;
        justify-content: space-between;
        flex-direction: row;
        flex-wrap: nowrap;
        margin:0 auto;
    }
    .searchform #SearchIndexQ{
        width:160px;
        float:none;
        background:#fff;
        height:20px;
        padding: 4px 4px;
        box-sizing:border-box;
        border:solid 1px #ccc;
    }
    .searchform .submit_button{
        width:70px;
        float:none;
        height:20px;
        padding: 4px 4px;
        box-sizing:border-box;
        border:solid 1px #ccc;
        background:#efefef;
        color:#222;
    }
    .search-wrapper{
        padding-top:5px;
        padding-bottom:5px;
    }
}







/*
============================================================
//home->newBlog
============================================================
*/

.newBlog-area{
    width:100%;
}
.secNewBlog{
    width:94%;
    max-width:960px;
    display : -webkit-box; 
    display : -webkit-flex; 
    display : -ms-flexbox;
    display : flex;
    padding:20px 0;
    margin:0 auto;
}
.secNewBlog a:hover{
    opacity:0.6;
}
.HtitleBlog{
    width:13.43%;
    max-width:129px;
    min-width:129px;
    display:flex;
    flex-direction: column;
    justify-content: center;
}
.HtitleBlog h2{
    display:block;
    width:100%;
    padding:25px 0;
    text-align:center;
    border-right: 1px solid #d5d5d5;
    font-size:12px;
    font-weight:700;
    line-height:100%;
    letter-spacing:0.4em;
    color:#777 !important;
    font-family: "Roboto",sans-serif;
    margin:auto;
}
.articleNewBlog{
    width:86.57%;
    font-family: "Roboto",sans-serif;
    color:#777;
    padding-left:40px;
}
.articleNewBlog dt {
        display:block;
        float: left;
        padding-bottom: 10px;
        font-size: 12px;
        font-weight: 400;
        letter-spacing: 0.05em;
        font-family: "Roboto",sans-serif;
        width:12%;
        vertical-align: baseline;
        line-height: 12px;
}
.articleNewBlog dt:last-of-type{
    padding-bottom:0;
}
.articleNewBlog dd{
    display:block;
    float:left;
    width: 88%;
    padding-bottom: 10px;
    font-size: 12px;
    font-weight: 400;
    letter-spacing: 0.05em;
    font-family: "Roboto",sans-serif;
    text-align:left;
    margin:0;
    padding-left:40px;
    box-sizing:border-box;
    overflow-wrap: break-word;
    word-break: break-word;
    line-height:12px;
}
.articleNewBlog dd:last-of-type{
    padding-bottom:0;
}
.articleNewBlog dd a{
    display:block;
    width:100%;
    color:#777 !important;
    line-height:12px;
    font-size:12px;

}

@media screen and (max-width:880px) {
    .secNewBlog{
        flex-wrap:wrap;
        padding:5px 0;
    }
    .HtitleBlog h2{
        text-align:left;
        border:none;
        padding:2px 0;
        color:#222 !important;
        margin:15px 0 0 0;
    }
    .articleNewBlog{
        width:100%;
        font-family: "Roboto",sans-serif;
        color:#777;
        padding-left:0px;
        padding:0;
        margin:0;
    }
    .articleNewBlog dt {
        width: 20%;
        padding-top: 10px;
        padding-bottom:2px;
        color: #222;
        font-size: 12px;
        font-weight: 700;
        line-height: 100%;
        letter-spacing: 0.05em;
        text-align:left;
    }
    .articleNewBlog dd{
        width: 80%;
        padding-top: 10px;
        font-size: 12px;
        font-weight: 400;
        padding-left: 3%;
        line-height:0.7em;
        padding-bottom:0px;
    }
    .articleNewBlog dd a{
        line-height:12px;
    
    }
    .clearLeft{
        clear: left;
    }

} 
/*
============================================================
//home->pick up movie
============================================================
*/
#update_movie{
    background:#f0f0f0;
    width:100%;
    padding:22px 0;
}
.pickupMovie_inner{
    width:94%;
    margin:0 auto;
    max-width:960px;
    display : -webkit-box; 
    display : -webkit-flex; 
    display : -ms-flexbox;
    display : flex;
    justify-content: space-between;
    flex-wrap:nowrap;
    font-family: 'Noto Serif','Koh Santepheap', cursive;
}

.pickupMovie_inner .pickUP_movielink{
    display:block;
    width:24%;
    max-width:232px;
    text-decoration: none;
    text-align:left;
    color:#777 !important;
    font-size:10.5px;
    font-weight:400;
    margin:0;
}
.pickupMovie_inner .pickUP_movielink:hover{
    opacity:0.5;
}
.pickupMovie_inner .pickUP_movielink img{
    margin:0;
    border:solid 1px #ccc;
    border-radius: 5px;
    object-fit: cover;
}


@media screen and (max-width:780px) { 
    #update_movie{
        display:none;
    }
}

/*
============================================================
//home->pick up products
============================================================
*/

#pickup_products{
    width:100%;
    padding:45px 0;
}
.pickupProducts_innner{
    width:94%;
    max-width:960px;
    margin:0 auto;
    display:flex;
}
.pickup_box{
    width:50%;
    margin:0;
    box-sizing:border-box;
    text-align:center;
}
.pickup_box:first-child{
    padding-right:5px;
    box-sizing:border-box;
}
.pickup_box:last-child{
    padding-left:5px;
    box-sizing:border-box;
}
.img_yo-zuri{
    width:70%;
    padding-bottom:21%;
    background:url('http://www.yo-zuri.com/files/uploads/index_yozuri.png') no-repeat;
    background-size:contain;
    margin:0 auto;
}
.img_hardcore{
    width:70%;
    padding-bottom:21%;
    background:url('http://www.yo-zuri.com/files/uploads/index_duel.png') no-repeat;
    background-size:contain;
    margin:0 auto;
}
.pickup_box span{
    display:block;
    color:#666;
    font-weight:700;
    font-size:0.8em;
    font-family: "Roboto",sans-serif;
    padding-top:10px;
    letter-spacing: 5px;
}
.text_yo-zuri{
    display:block;
    position:relative;
    width:100%;
    padding:15px;
    box-sizing:border-box;
    font-size:20px;
    font-weight:700;
    text-align:center;
    margin:20px 0 5px;
}

.text_yo-zuri:after{
    position:absolute;
    width:100%;
    top:50%;
    left:0;
    content:"";
    z-index:0;
    height:1px;
    background:#f6ccd1;
}
.text_yo-zuri span{
    position:relative;
    display:inline-block;
    background-color:#fafafa;
    z-index:1;
    padding:5px 10px;
    margin:0 auto;
    text-align:center;
    color:#222;
    font-size:1.1em;
    letter-spacing:1px;
}
.text_hardcore{
    display:block;
    position:relative;
    width:100%;
    padding:15px;
    box-sizing:border-box;
    font-size:20px;
    font-weight:700;
    text-align:center;
    margin:20px 0 5px;
}

.text_hardcore:after{
    position:absolute;
    width:100%;
    top:50%;
    left:0;
    content:"";
    z-index:0;
    height:1px;
    background:#ccc;
}
.text_hardcore span{
    position:relative;
    display:inline-block;
    background-color:#fafafa;
    z-index:1;
    padding:5px 10px;
    margin:0 auto;
    text-align:center;
    color:#222;
    font-size:1.1em;
    letter-spacing:1px;
}
.brandText{
    color:#666;
    font-family: "Roboto",sans-serif;
    font-size:0.75em;
    font-weight:700;
    letter-spacing:0.5em;
}
.pickupProducts_innner .pickup_box .bunner-wrap{
    width:100%;
    display : -webkit-box; 
    display : -webkit-flex; 
    display : -ms-flexbox;
    display : flex;
    justify-content: space-between;
}

.pickupProducts_innner .pickup_box .pickUP_yzlink{
    display:block;
    width:32%;
    text-decoration: none;
    text-align:center;
    color:#222 !important;
    font-size:10.5px;
}
.pickupProducts_innner .pickup_box .pickUP_yzlink:hover{
    opacity:0.5;
}

.pickUP_bunner_yo-zuri{
    width:100%;
    padding-bottom:50%;
    background-size:contain;
    background-repeat:no-repeat;
    border:solid 1px #f6ccd1;
    background-color:#fff;
}
.pickupProducts_innner .pickup_box .pickUP_hclink{
    display:block;
    width:32%;
    text-decoration: none;
    text-align:center;
    color:#222 !important;
    font-size:10.5px;
}
.pickupProducts_innner .pickup_box .pickUP_hclink:hover{
    opacity:0.5;
}
.pickUP_bunner_hardcore{
    width:100%;
    padding-bottom:50%;
    background-size:contain;
    background-repeat:no-repeat;
    border:solid 1px #ccc;
    background-color:#fff;
}
@media screen and (max-width:880px) { 
    #pickup_products{
        padding-top:20px;
    }
    .pickupProducts_innner{
        flex-wrap:wrap;
    }
    .pickup_box{
        width:100%;
    }
    .pickup_box:first-child{
        padding-right:0px;
    }
    .pickup_box:last-child{
        padding-left:0px;
    }
    .img_yo-zuri{
        width:100%;
        padding-bottom:15%;
        background-position:center;
        background-color:#fff;
        background-size:42%;
    }
    .img_hardcore{
        width:100%;
        padding-bottom:15%;
        background-position:center;
        background-color:#fff;
        background-size:42%;
    }
    .brandText{
        display:none;
    }
    .text_yo-zuri{
        padding:0px;
        font-size:18px;
        margin:10px 0 0 0;
        letter-spacing:0;
        font-weight:900;
    }
    .text_yo-zuri:after{
        display:none;
    }
    .text_yo-zuri span{
        letter-spacing:0;
        font-weight:900;
    }
    .pickUP_bunner_yo-zuri{
        border:none;
    }
    .text_hardcore{
        padding:0px;
        font-size:18px;
        margin:10px 0 0 0;
        letter-spacing:0;
        font-weight:900;
    }
    .text_hardcore span{
        letter-spacing:0;
        font-weight:900;
    }
    .text_hardcore:after{
        display:none;
    }
    .pickUP_bunner_hardcore{
        border:none;
    }
    .bunner-wrap{
        flex-wrap:wrap;
    }
    .bunner-wrap img {
        border:none;
    }
    .pickupProducts_innner .pickup_box .pickUP_yzlink{
        display:block;
        width:49%;
        text-decoration: none;
        text-align:center;
        color:#222 !important;
        font-size:8px !important;
        margin-bottom:13px;
    }
    .text_yo-zuri span{
        font-size:0.9em;
    }
    .text_hardcore span{
        font-size:0.9em;
    }
    
}

/*
============================================================
//home->pro staff & youtube channel
============================================================
*/
#proStaff{
    width:100%;
    height:40vh;
    max-height:400px;
    background:url('http://www.yo-zuri.com/files/uploads/bk_staff.jpg');
    background-repeat:no-repeat;
    background-size:cover;
    position:relative;
    background-position:center;
}
#youtube{
    width:100%;
    height:40vh;
    max-height:400px;
    background:url('http://www.yo-zuri.com/files/uploads/bk_movie.jpg');
    background-repeat:no-repeat;
    background-size:cover;
    position:relative;
    background-position:center;
}
.andmore_wrap{
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100%;
    min-width: 350px;
    z-index: 1;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    padding: 3vh 0;
    text-align:center;
    color:#fff;
    font-family: "Roboto",sans-serif;
}
.andmore_wrap p{
    margin:0;
    font-weight:400;
    font-size:2em;
    text-shadow: 0 0 3px #000;
}
.white_bar{
    width:60px;
    height:2px;
    background:#fff;
    margin:0 auto;
    
}
.andmore_btn{
    display:block;
    width:200px;
    margin:0 auto;
    padding:7px 0;
    text-align:center;
    text-decoration: none;
    background:#fff;
    margin-top:2vh;
    color:#222;
}
.andmore_btn:hover{
    background:#222;
    color:#fff !important;
}
@media screen and (max-width:880px) { 
    #proStaff{
        height:40vh;
        max-height:140px;
    }
    #youtube{
        height:40vh;
        max-height:140px;
    }
    .andmore_wrap p{
        margin:0;
        font-weight:400;
        font-size:18px;
        text-shadow: 0 0 3px #000;
    }
    .andmore_btn{
        background:rgba(255,255,255,0.7);
        padding:4px 0;
        font-size:14px;
        margin-top:1vh;
    }
    .white_bar{
        display:none;
    }
}
/*
============================================================
//home->about YO-ZURI
============================================================
*/
#about_yo-zuri{
    width:100%;
    padding:50px 0;
}
.about_yo-zuri_innner{
    width:94%;
    max-width:960px;
    text-align:left;
    font-family: "Roboto",sans-serif;
    margin:0 auto;
    color:#222;
}
.about_yo-zuri_innner h1{
    font-size:1.6em;
    font-weight:400;
    margin:0;
}
.about_yo-zuri_innner p{
    font-size:0.8em;
    line-height:200%;
    letter-spacing:1px;
    overflow-wrap: break-word;
    word-break: break-word;
}
.black_bar{
    width:30px;
    height:2px;
    background:#222;
    margin:3px 0 30px 0;
    
}
@media screen and (max-width:880px) {
    .about_yo-zuri_innner{
        text-align:center;
    }
    .black_bar{
        margin:10px auto 30px;
        width:10%;
    }
    .about_yo-zuri_innner p{
        display:block;
        width:90%;
        margin:0 auto;
        text-align:left;
        line-height:180%;
        letter-spacing:0.03em;
        font-size:12px;
    }
    .about_yo-zuri_innner h1{
        font-size:21px;
        font-weight:700;
    }
}




/*
============================================================
//home->FOOTER
============================================================
*/
#footer{
	width:100%;
    padding:50px 0 0px;
}
#footer p{
    display:block;
    width:94%;
    max-width:960px;
	text-align:right;
    margin:0 auto;
	font-size:11px;
	color:#aaa;
    font-weight:400;
    letter-spacing:0.01em;
    padding:7px 0;
    font-family: "Roboto",sans-serif;
    overflow-wrap: break-word;
}
#footer p small{
    display:block;
    width:100%;
}
.spacer-15{
    width:100%;
    padding:15px 0;
}
@media screen and (max-width:960px) {
    #footer{
        width:100%;
        padding:25px 0 0px;
    }
    #footer p{
        background:#000;
        color:#fff;
        width:100%;
        text-align:center;
        overflow-wrap: break-word;
    }
    #footer p small{
        width:94%;
        margin: 0 auto;
        text-align:justfy;
    }
    .spacer-15{
        display:none;
    }
}

/*
============================================================
//Products->single.php
============================================================
*/
@keyframes fadeIn{
    0%{
        opacity: 0;
	}
	100%{
	    opacity: 1;
	}
}

.fade-in-2ms{
    animation: fadeIn 0.2s linear;
}
.single-wrapper{
    width:94%;
    max-width:960px;
    margin:0 auto;
    text-align: left !important;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    flex-wrap:wrap;
    flex-direction: row;
    font-family: "Roboto",sans-serif;
}
/*詳細ページ要を分離*/
.single-wrapper .productName{
    width:100%;
    text-align:left;
    padding:30px 0px 2px;
    box-sizing:border-box;
}
.single-wrapper .productName h1{
    text-decoration:none;
    font-weight:700;
    font-size:40px;
    line-height:40px;
    margin:0;
    padding:0;
}
.productName_black_bar{
    width:50px;
    height:2px;
    background:#222;
    margin:10px 0 30px 0;
    
}
.single-wrapper .productName h1 a{
    display:block;
    position:relative;
    text-decoration:none;
    overflow-wrap: break-word;
    margin:0;
    padding:0;
    line-height:40px;
}
.breadcrumbs{
    display: inline-block;
    color: #222;
    font-family: "Roboto",sans-serif;
    font-weight: 700;
    font-size: 1em;
    text-decoration: none;
    line-height:15px;
}
.title-area a{
    text-decoration:none;
}
.productName a{
    text-decoration:none;
}
.title-area a:hover{
    opacity:0.6;
}
.productName a:hover{
    opacity:0.6;
}

/*一覧ページ要を分離*/
.single-wrapper .title-area{
    width:100%;
    text-align:left;
    padding:60px 0px 2px;
    box-sizing:border-box;
}
.single-wrapper .title-area h1{
    text-decoration:none;
    font-weight:700;
    font-size:40px;
    margin:0;
    padding:0;
    line-height:40px;
    font-family: "Roboto",sans-serif;
}
.single-wrapper .title-area h1 a{
    display:block;
    position:relative;
    text-decoration:none;
    overflow-wrap: break-word;
    margin:0;
    padding:0;
    line-height:40px;
}
.title_black_bar{
    width:50px;
    height:2px;
    background:#222;
    margin:10px 0 30px 0;
    
}
.single-wrapper .left-area{
    width:50%;
    text-align:left;
    text-align: justify;
}
.single-wrapper .left-area img{
    width:100%;
}
.single-wrapper .right-area{
    width:50%;
    text-align:left;
    text-align: justify;
    padding:0 0 0 0%;
    box-sizing:border-box;
}
.single-wrapper .right-area .detailText{
    line-height:180%;
    font-size:16px;
    color:#222;
    width:100%;
    padding-left:25px;
    box-sizing:border-box;
}
.single-wrapper .right-area p{
    line-height:180%;
    font-size:16px;
    color:#222;
    margin:0;
}
.single-wrapper .right-area .pointList{
    margin:0;
    padding: 0 0 0 20px;
}
.single-wrapper .right-area .pointList li{
    padding-bottom:10px;
}
.single-wrapper .subtitle{
    width:100%;
}
.single-wrapper h2{
    display:block;
    padding:30px 0 15px;
    margin:0;
    font-weight:700;
    font-size:22.6px;
}
.single-wrapper h1{
    display:block;
    padding:30px 0 15px;
    margin:0;
    font-weight:700;
    font-size:22.6px;
}
.single-wrapper h3{
    display:block;
    padding:30px 0 15px;
    margin:0;
    font-weight:700;
    font-size:22.6px;
}
.single-wrapper .color-area{
    width:100%;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    flex-direction: row;
    flex-wrap:wrap;
    justify-content: start;
    gap:1%;
}
.single-wrapper .color-area .color-item{
    width:19.2%;
    min-width:120px;
    padding:0 0%;
    box-sizing:border-box;
    font-size:11.3px;
    font-weight:700;
    overflow-wrap: break-word;
    word-break: break-word;
}

.single-wrapper .color-area .color-item .color-wrap{
    display:block;
    position:relative;
    width:100%;
    padding-bottom:50%;
    
}
.single-wrapper .color-area .color-item img{
    position:absolute;
    top:0;
    left:0;
    display:block;
    width:100%;
    height:100%;
    object-fit:cover;
    cursor: pointer;
    cursor: hand;
}
.single-wrapper .color-area .color-item p{
    display:block;
    width:100%;
    text-align:center;
}

.single-wrapper .color-area .bigImage-back{
    background:rgba(0, 0, 0, 0.6);
    position:fixed;
    left:0;
    top:0px;
    width:100%;
    height:100%;
    z-index:3;
    overflow:hidden;
    padding:15%;
    box-sizing:border-box;
    display:none;
    z-index:1000;
}
.single-wrapper .color-area .bigImage{
    object-fit:contain;
    width:100%;
    height:100%;

}

.single-wrapper .movie-area{
    width:100%;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    flex-wrap:wrap;
    justify-content: space-between;
    position:relative;
}
.single-wrapper .movie-area p{
    display:block;
    width:49%;
    margin:0 0 20px;
    padding-top:27.5625%;
    position:relative;
}
.movie-flame{
    position:absolute;
    top:0;
    left:0;
    width:100% !important;
    height:100% !important;
}

.single-wrapper .movie-area iframe{
    position:absolute;
    top:0;
    left:0;
    width:100% !important;
    height:100% !important;
}
.table-area{
    display:block;
    width:100%;
    padding:0;
    overflow-x:auto;
    font-family: "Roboto",sans-serif;
}
.table-area th {
    background: #222;
    border: solid 1px #222;
    color: #fff;
    padding: 3px;
    text-align:center;
    font-size:11px;
    font-weight:700;
}
.table-area td {
  border: solid 1px #ccc;
  padding: 10px 5px;
  font-size:15px;
}
.table-area tr:nth-child(even){
    background:#ececec;
}
.mobile_under{
    width:100%;
    padding:0;
    margin:0;
    box-sizing:border-box;
}
#p65warning{
    display: block;
    margin-bottom: 0px;
    margin-top:50px;
    padding: 15px;
    border: 1px solid #aaa;
    background-color: #fafafa;
}
#p65warning .icon svg{
    display: block;
    width: 50px;
    height: auto;
    margin: 0 auto;
}
#p65warning article{
    padding-top: 10px;
}
#p65warning h1{
    display: inline;
    font-size: 13px;
    font-weight: 700;
    line-height: 150%;
}
#p65warning p{
    display: inline;
    font-size: 13px;
    line-height: 150%;
}
#p65warning a{
    color: #000;
}
#p65warning .jp{
    font-family: sans-serif;
}


@media screen and (max-width:880px) {
    .single-wrapper{
        flex-direction: column; 
    }
    .single-wrapper .title-area{
        text-align:center;
        padding-top:40px;
        padding-bottom:20px;
    }
    .single-wrapper .title-area .title_black_bar{
       margin:15px auto 10px;
       width:10%;
    }
    .single-wrapper .left-area{
        width:100%;
    }
    .single-wrapper .right-area{
        width:100%;
        padding:20px 0 0%;
    }
    .single-wrapper .color-area{
        gap:2%;
    }
    .single-wrapper .color-area .color-item{
        width:49%;
        font-size:11px;
        font-weight:300;
    }

    .single-wrapper .color-area .bigImage-back{
        padding:2%;
    }
    .single-wrapper .movie-area{
        flex-direction: column; 
    }
    .single-wrapper .movie-area p{
        width:100%;
        padding-top:56.25%;
    }
    .table-area th {
        font-size:0.9vmax;
        padding:10px 5px;
    }
    .table-area td {
      font-size:0.9vmax;
      padding:10px 5px;
    }
    .single-wrapper .productName{
        text-align:center;
    }
    .single-wrapper .productName h1{
        font-size:22.6px;
        padding-bottom:20px;
    }
    .productName_black_bar{
        display:none;        
    }
    .single-wrapper h2{
        padding:20px 0 10px;
        margin:0;
        font-size:16px;
        font-weight:700;
    }
    .single-wrapper h1{
        padding:20px 0 10px;
        margin:0;
        font-size:16px;
        font-weight:700;
    }
    .single-wrapper h3{
        padding:20px 0 10px;
        margin:0;
        font-size:16px;
        font-weight:700;
    }
    .single-wrapper .right-area .detailText{
        padding-left:0px;
        padding:20px;

    }
    .single-wrapper .title-area h1{
        font-size:37px;
        line-height:40px;
    }
    .mobile_under{
        padding: 0 20px;
    }
}

/*
============================================================
//Products->index.php,archives.php
============================================================
*/
.productList{
    width:100%;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    flex-wrap:wrap;
    justify-content:start;
    padding-bottom:40px;
}
.yo-zuri_logoImage{
    width:80%;
    max-width:300px;
    padding-bottom:11%;
    background:url('http://www.yo-zuri.com/files/uploads/index_yozuri.png') no-repeat;
    background-size:contain;
    background-position:center;
    margin:0 auto;
    margin-bottom:20px;
}
.hardcore_logoImage{
    width:80%;
    max-width:300px;
    padding-bottom:11%;
    background:url('http://www.yo-zuri.com/files/uploads/index_duel.png') no-repeat;
    background-size:contain;
    background-position:center;
    margin:20px auto;
}
.productList .productItem{
    display:block;
    width:31%;
    margin:1.6% 3.5% 1.6% 0;
    box-sizing:border-box;
    text-decoration: none;
}
.productList .productItem:nth-of-type(3n){
    margin:1.6% 0 1.6% 0;
}

.productList .productItem:hover{
    opacity:0.5;
}
.productList .productItem .imageWrap{
    position:relative;
    width:100%;
    padding-bottom:56.25%;
    background:#fff;
}

.productList .productItem .imageWrap img{
    position:absolute;
    width:100%;
    height:100%;
    object-fit:contain;
    top:0;
    left:0;
}
.productList .productItem span{
    display:block;
    width:100%;
    text-align:center;
    padding:10px 0 0;
    color:#222;
    text-decoration: none;
}
.productList .productItem small{
    display:block;
    width:100%;
    text-align:center;
    color:#aaa;
    text-decoration: none;
}
@media screen and (max-width:680px) {
    .yo-zuri_logoImage{
        margin-bottom:20px;
    }
    .hardcore_logoImage{
        margin-bottom:20px;
    }
    .productList .productItem{
        width:100%;
        display:flex;
        flex-direction:row;
        flex-wrap:wrap;
        box-sizing:border-box;
        background:#fff;
        margin:4px 0;
        flex-wrap:nowrap;
    }
.mobile_flex{
        width:50%;
        display:flex;
        flex-direction: column;
        min-width:100px;
        position:relative;
    }
    .productList .productItem .imageWrap{
        width:50%;
        min-width:160px;
        padding-bottom:25%;
        padding-right:10px;
        box-sizing:border-box;
    }
    .productList .productItem .imageWrap img{
        object-fit: contain;
    }
    .productList .productItem span{
        text-align:left;
        box-sizing:border-box;
        width:100%;
        display:block;
        overflow-wrap: break-word;
        word-break: break-word;
        padding-left:10px;
        font-size:14px;
    }
    .productList .productItem small{
        text-align:left;
        box-sizing:border-box;
        width:100%;
        display:block;
        overflow-wrap: break-word;
        word-break: break-word;
        padding-left:10px;
        font-size:10px;

    }
    .yo-zuri_logoImage{
        padding-bottom:21%;
    }
    .hardcore_logoImage{
        padding-bottom:21%;
    }


}

/*
============================================================
//Prostaff->index.php
============================================================
*/
.proStaffList{
    width:100%;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    flex-wrap:wrap;
    justify-content:start;
    gap: 10px 2.9%;
}
.proStaffList .proStaffItem{
    display:block;
    width:31.4%;
    padding:0;
    box-sizing:border-box;
    text-decoration: none;
    text-align:center;
    cursor: pointer;
    cursor: hand;
}
.proStaffList .proStaffItem:hover{
    opacity:0.5;
}
.proStaffList .proStaffItem .imageWrap{
    position:relative;
    width:100%;
    padding-bottom:50%;
    background:#000;
}

.proStaffList .proStaffItem .imageWrap img{
    position:absolute;
    width:100%;
    height:100%;
    object-fit:cover;
    top:0;
    left:0;
}
.proStaffList .proStaffItem span{
    display:block;
    width:100%;
    text-align:center;
    padding:10px 0 0;
    color:#222;
    text-decoration: none;
    font-size:16px;
    line-height:16px;
}
.proStaffList .proStaffItem small{
    display:block;
    width:100%;
    text-align:center;
    color:#aaa;
    text-decoration: none;
}
.proStaffList .proStaffItem small p{
    margin:0;
}
.ps-detail-bg{
    width:100%;
    height:100%;
    background:rgba(0,0,0,0.6);
    position:fixed;
    top:0;
    left:0;
    display : -webkit-box; 
    display : -webkit-flex; 
    display : -ms-flexbox;
    display : flex;
    box-sizing:border-box;
    z-index:1000;
}
.ps-detail-wrapper{
    position:fixed;
    top:50%;
    left:50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    width:94%;
    height:94%;
    max-width:800px;
    max-height:500px;
    display : -webkit-box; 
    display : -webkit-flex; 
    display : -ms-flexbox;
    display : flex;
    background:#fff;
}
.ps-detail-left{
    width:50%;
}

.swiper-wrapper{
    width:100%;
}
.swiper-slide{
    width:100%;
    height:100%;
}
.ps-detail-left div{
    width:100%;
    height:100%;
}
.ps-detail-right{
    width:50%;
    padding:4% 4%;
    box-sizing:border-box;
    overflow-y: auto;
}
.ps-name-area{
    font-weight:700;
    padding-bottom:10px;
    font-size:33px;
    display:block;
    overflow-wrap: break-word;
    word-break: break-word;
    display:block;
    text-align:left;
    margin:0;
    padding:0;
    font-family: "Roboto",sans-serif;
}
.overView-area{
    padding:0 0 30px 0;
    margin:0;
    overflow-wrap: break-word;
    word-break: break-word;
}
.overView-area p{
    margin:0;
    padding:0;
    font-size:15px;
    font-weight:700;
    overflow-wrap: break-word;
    word-break: break-word;
}
.ps-detail-text p{
    display: block;
    text-align:left;
    text-align: justify;
    width:100%;
    letter-spacing: 1px;
    overflow-wrap: break-word;
    word-break: break-word;
    line-height:170%;
    font-size:12px;
}

.ps-movie-area p{
    display:block;
    width:100%;
    margin:3% 0;
    padding-top:56.25%;
    font-size:12px;
    position:relative;
}
.movie-flame{
    position:absolute;
    top:0;
    left:0;
    width:100% !important;
    height:100% !important;
}

.ps-movie-area iframe{
    position:absolute;
    top:0;
    left:0;
    width:100% !important;
    height:100% !important;
}
.h2-ps-products{
    padding: 20px 0 !important;
    font-size: 14px;
    line-height: 100%;
    font-weight: 700;
    display:block;
}
.ps-products-box{
    width:100%;
    display : -webkit-box; 
    display : -webkit-flex; 
    display : -ms-flexbox;
    display : flex;
    border  : solid 1px #eee;
    padding:10px;
    flex-wrap:nowrap;
    box-sizing:border-box;
    flex-direction: row;
    margin:2% 0;
    text-decoration: none;
}
.ps-products-box:hover{
    opacity: 0.5;
}
.ps-products-imgWrap{
    width:40%;
    padding-top:20%;
    position:relative;
}
.ps-products-box img{
    display:block;
    width:100%;
    height:100%;
    object-fit:contain;
    position:absolute;
    top:0;
    left:0;

}
.ps-products-box p{
    display:block;
    width:60%;
    font-size:10px;
    text-align:left;
    padding-left:15px;
    box-sizing:border-box;
    text-decoration: none;
}

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

    .ps-detail-wrapper{
        flex-direction: column;
        overflow-y: auto;
        height:90%;
        max-height:90%;
        width:90%;
        margin:0 auto;
        box-sizing:border-box;
        padding:0;
    }
    .ps-detail-left{
        display:none;
    }
    .ps-detail-right{
        width:100%;
        font-size:13px;
    }
    .ps-name-area{
        font-size:30px;
    }
    .overView-area{
        font-size:16px;
    }
    .proStaffList .proStaffItem{
        width:48.55%;
    }
    .proStaffList .proStaffItem span{
        font-size:11px;
        font-weight:700;
        width:100%;
    }
    .proStaffList .proStaffItem small{
        font-size:11px;
    }
    .proStaffList .proStaffItem small p{
        display:none;
    }
    .overView-area p{
        padding: 25px 0 0px;
        font-size: 14px;
        line-height: 100%;
        font-weight: 700;
    }
    .overView-area{
        padding:0;
    }
    .ps-products-box{
        border: solid 1px #ccc;
    }
    .h2-ps-products{
        padding: 20px 0 3px !important;
    }
}
/*
============================================================
//blog
============================================================
*/
@keyframes hoverUp{
    0%{
        transform: translateY(0px);
	}
	100%{
	    transform: translateY(-2px);
	}
}
.blogHead-area{
    width:100%;
    height:220px;
    box-sizing:border-box;
    background:url('http://www.yo-zuri.com/files/uploads/braid-website.jpg');
    background-repeat:no-repeat;
    background-size:cover;
    background-position:center;
    position:relative;
    font-family: 'Meiryo','Noto Serif',sans-serif;
}
.blogHead-area h1{
    display:block;
    position:absolute;
    width:100%;
    text-align:center;
    font-size:40px;
    letter-spacing: 0.05em;
    top:50%;
    left:0;
    color:#fff;
    font-weight:700;
    transform: translate(0, -50%);
    -webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    margin:0;
    line-height: 120%;
    font-family: 'Meiryo','Noto Serif',sans-serif;
}

.blogHead-area h1:after{
    display: block;
    position: absolute;
    width: 130px;
    height: 4px;
    bottom: -8px;
    left: 50%;
    margin-left: -65px;
    background-color: #fff;
    content: "";
    z-index: 5;
    -webkit-box-shadow: 0 0 4px rgba(0,0,0,0.7);
    -moz-box-shadow: 0 0 4px rgba(0,0,0,0.7);
    box-shadow: 0 0 4px rgba(0,0,0,0.7);
}


.tagList-area{
    width:100%;
    background:#efefef;
    font-family: 'Meiryo','Noto Serif',sans-serif;
}
.tagList-area .tagList{
    width:94%;
    max-width:960px;
    margin:0 auto;
    padding:10px 0;
    display : -webkit-box; 
    display : -webkit-flex; 
    display : -ms-flexbox;
    display : flex;
    justify-content:start;
    flex-wrap:wrap;
}
.tagList-area .tagList .tags{
    padding:5px 10px 5px 0;
    text-decoration: none;
    color:#888 !important;
    font-size:12px;
    font-weight:700;
    letter-spacing:0.08em;
    font-family: 'Meiryo','Noto Serif',sans-serif;
}
.tagList-area .tagList .tags:hover{
    color:#333 !important;
}

.blogWrapper{
    width:94%;
    max-width:960px;
    margin:0 auto;
    display : -webkit-box; 
    display : -webkit-flex; 
    display : -ms-flexbox;
    display : flex;
    text-align:left;
}

.blogContents-area{
    width:72%;
    padding:3vh 50px 3vh 0;
    box-sizing:border-box;
    font-family: 'Meiryo','Noto Serif',sans-serif;
}
.blogContents-area .blogTitle{
    margin:0;
}
.blogContents-area .blogTitle a{
    display:block;
    color:#222 !important;
    text-decoration: none;
    font-size:30px;
    font-weight:700;
    line-height:120%;
    margin:0;
    transition:0.1s;
    font-family: 'Meiryo','Noto Serif',sans-serif;
    letter-spacing:0.05em;
}
.blogContents-area .blogTitle a:hover{
    text-shadow: #ccc 0px 3px 5px;
    animation: hoverUp 0.1s linear;
    animation-fill-mode: forwards;
    transition:0.1s;
}
.blogContents-area time{
    font-size:13px;
    color:#999;
    letter-spacing:1px;
    font-weight:700;

}
.blogDetail{
    display:block;
    width:100%;
    padding:2vh 0;
    text-align:left;
    letter-spacing:0.02em;
    overflow-wrap: break-word;
    word-break: break-word;
    font-size:18px;
    font-weight:400;
    text-align: justify;
    text-align-last: left;
    font-family: 'Meiryo','Noto Serif',sans-serif;

}
.blogDetail a + br{
    display:none;
}
.taglist{
    width:100%;
    display : -webkit-box; 
    display : -webkit-flex; 
    display : -ms-flexbox;
    display : flex;
    flex-wrap:wrap;
    padding-top:15px;
}
.posttags{
    display: block;
    margin-bottom: 0.5em;
    margin-right: 0.5em;
    padding: 5px 10px 4px;
    border-radius: 3px;
    background-color: #efefef;
    font-weight: 700;
    color: #000;
    font-size: 12px;
    line-height: 100%;
    text-decoration: none;
}
.posttags:hover{
    background-color: #666;
    color:#fff !important;
    animation: hoverUp 0.1s linear;
    animation-fill-mode: forwards;
}
.blogDetail p img{
    display:block;
    width:100%;
    margin:5px 0 5px;
}

.blogDetail p{
    line-height:180%;
    color:#444 !important;
}
.entrySpacer{
    display:block;
    width: 80px;
    height: 3px;
    background-color: #d0d0d0;
    margin:72px auto;
}
.entrySpacer:last-of-type{
    height: 0px;
}
.singleSpacer{
    display:block;
    width: 80px;
    height: 0px;
    background-color: #d0d0d0;
    margin:70px auto;
}
.blogFoot{
    display:block;
    position:relative;
    width:100%;
    padding:17px 0;
}
.blogFoot time{
    font-size:12px;
    color:#ccc;
    font-weight:400;

}
.follow-me {
    list-style: none;
    margin: 0px 0 -8px;
    overflow: hidden;
    padding: 7px 0 0 0;
    display:block;
    position:absolute;
    top:50%;
    right:0;
    transform: translate(0, -50%);
    -webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
  }
  .follow-me li {
    float: right;
    margin: 0 0px 8px 4px;
    padding: 0;
    
  }
  .follow-me li a{
      text-decoration: none;
  }
  .follow-me li a::before {
    -webkit-border-radius: 100%;
    border-radius: 100%;
    color: #fff;
    display: inline-block;
    font-family: FontAwesome;
    font-size: 16px;
    height: 34px; /* Button height */
    line-height: 34px; /* Button height */
    -webkit-transition: all .3s ease;
    transition: all .3s ease;
    text-align: center;
    width: 34px; /* Button width */
  }
  .follow-me li a:hover::before {
    box-shadow: #ccc 0px 3px 5px;
    animation: hoverUp 0.1s linear;
    animation-fill-mode: forwards;
    transition:0.3s;
  }
  .follow-me li a[href*="amazon.co.jp"]::before,
  .follow-me li a[href*="amazon.com"]::before         { background-color: #ff9900; content: "\f270"; }
  .follow-me li a[href*="codepen.io"]::before         { background-color: #000000; content: "\f1cb"; }
  .follow-me li a[href*="delicious.com"]::before      { background-color: #3399ff; content: "\f1a5"; }
  .follow-me li a[href*="deviantart.com"]::before     { background-color: #05cc47; content: "\f1bd"; }
  .follow-me li a[href*="digg.com"]::before           { background-color: #000000; content: "\f1a6"; }
  .follow-me li a[href*="dribble.com"]::before        { background-color: #ea4c89; content: "\f17d"; }
  .follow-me li a[href*="dropbox.com"]::before        { background-color: #007ee5; content: "\f16b"; }
  .follow-me li a[href*="facebook.com"]::before       { background-color: #3b5998; content: "\f09a"; }
  .follow-me li a[href*="feedly.com"]::before         { background-color: #6cc655; content: "\f09e"; }
  .follow-me li a[href*="flickr.com"]::before         { background-color: #0063dc; content: "\f16e"; }
  .follow-me li a[href*="foursquare.com"]::before     { background-color: #f94877; content: "\f180"; }
  .follow-me li a[href*="github.com"]::before         { background-color: #181717; content: "\f09b"; }
  .follow-me li a[href*="plus.google.com"]::before    { background-color: #dc4e41; content: "\f0d5"; }
  .follow-me li a[href*="b.hatena.ne.jp"]::before     { background-color: #008fde; content: "\f027"; font-family: blogicon; }
  .follow-me li a[href*="instagram.com"]::before      { background-color: #125688; content: "\f16d"; }
  .follow-me li a[href*="last.fm"]::before            { background-color: #d51007; content: "\f202"; }
  .follow-me li a[href*="linkedin.com"]::before       { background-color: #0077b5; content: "\f0e1"; }
  .follow-me li a[href*="nicovideo.jp"]::before       { background-color: #eaeaea; content: "\f047"; font-family: blogicon; }
  .follow-me li a[href*="pinterest.com"]::before      { background-color: #bd081c; content: "\f0d2"; }
  .follow-me li a[href*="getpocket.com"]::before      { background-color: #ef3f56; content: "\f265"; }
  .follow-me li a[href*="reddit.com"]::before         { background-color: #ff4500; content: "\f1a1"; }
  .follow-me li a[href*="skype.com"]::before,
  .follow-me li a[href*="skype:"]::before             { background-color: #00aff0; content: "\f17e"; }
  .follow-me li a[href*="slideshare.net"]::before     { background-color: #2d2d2d; content: "\f1e7"; }
  .follow-me li a[href*="spotify.com"]::before        { background-color: #84bd00; content: "\f1bc"; }
  .follow-me li a[href*="steamcommunity.com"]::before { background-color: #171a21; content: "\f1b6"; }
  .follow-me li a[href*="stumbleupon.com"]::before    { background-color: #eb4929; content: "\f1a4"; }
  .follow-me li a[href*="tumblr.com"]::before         { background-color: #36465d; content: "\f173"; }
  .follow-me li a[href*="twitch.tv"]::before          { background-color: #6441a5; content: "\f1e8"; }
  .follow-me li a[href*="twitter.com"]::before        { background-color: #55acee; content: "\f099"; }
  .follow-me li a[href*="vimeo.com"]::before          { background-color: #1ab7ea; content: "\f27d"; }
  .follow-me li a[href*="vine.co"]::before            { background-color: #11b58a; content: "\f1ca"; }
  .follow-me li a[href*="weibo.com"]::before          { background-color: #e6162d; content: "\f18a"; }
  .follow-me li a[href*="whatsapp.com"]::before       { background-color: #64d548; content: "\f232"; }
  .follow-me li a[href*="wordpress.com"]::before,
  .follow-me li a[href*="wordpress.org"]::before      { background-color: #21759b; content: "\f19a"; }
  .follow-me li a[href*="youtube.com"]::before        { background-color: #cd201f; content: "\f16a"; }
  .follow-me li a[href$="/feed"]::before              { background-color: #ffa500; content: "\f09e"; }
  .follow-me li a[href$="/subscribe"]::before         { background-color: #363636; content: "\f000";  font-family: blogicon; }


  @media screen and (max-width:790px) {
    .blogHead-area{
        width:100%;
        height:77px;
        box-sizing:border-box;
        background:url('http://www.yo-zuri.com/files/uploads/braid-website.jpg');
        background-repeat:no-repeat;
        background-size:cover;
        background-position:center;
        position:relative;
        font-family: 'Meiryo','Noto Serif',sans-serif;
    }
    .blogHead-area h1{
        display:block;
        position:absolute;
        width:100%;
        text-align:center;
        font-size:22px;
        letter-spacing: 0.05em;
        top:50%;
        left:0;
        color:#fff;
        font-weight:700;
        transform: translate(0, -50%);
        -webkit-transform: translate(0, -50%);
        -ms-transform: translate(0, -50%);
        margin:0;
        line-height: 120%;
        font-family: 'Meiryo','Noto Serif',sans-serif;
    }
    
    .blogHead-area h1:after{
        display:none;
    }
    .tagList-area .tagList .tags{
        padding:0 10px 8px 0;
        line-height:12px;
    }
    .blogContents-area{
        width:100%;
        padding:3vh 0px 3vh 0;
        box-sizing:border-box;
        font-family: 'Meiryo','Noto Serif',sans-serif;
        
    }
    .blogContents-area .blogTitle a{
        display:block;
        color:#222 !important;
        text-decoration: none;
        font-size:17px;
        font-weight:700;
        line-height:130%;
    }
    .blogDetail{
        font-size:14px;
        line-height:180%;
        letter-spacing:0.02em;
        text-align:left;
    }
    .entrySpacer{
        height:0;
        margin:20px auto;
    }

    .follow-me {
        margin: 0px auto -8px;
        overflow: hidden;
        padding: 10px 0;
        display:flex;
        flex-direction: row;
        justify-content: center;
        position:relative;
        top:0;
        left:0;
        transform: translate(0, 0%);
        -webkit-transform: translate(0, 0%);
        -ms-transform: translate(0, 0%);
      }
      .follow-me li {
          float:left;
          margin:0px 2px;
      }
  }

.contentsNavi a{
    font-weight: 700;
}
/*
============================================================
//widget
============================================================
*/
/*calendar*/

.blogWidgetCalender .calendar_PREV a{
    border:none;
    background:#fafafa;
    padding:0;
    cursor: pointer;
    cursor: hand;
    font-size:10px !important;
    color:#999999 !important;
    float:left;
    
}

.blogWidgetCalender .calendar_NEXT a{
    border:none;
    background:#fafafa;
    padding:0;
    cursor: pointer;
    cursor: hand;
    font-size:10px !important;
    color:#999999 !important;
    float:right;
}
.blogWidgetCalender .calendar_NEXT a:hover,
.blogWidgetCalender .calendar_PREV a:hover{
    text-shadow: #ccc 0px 3px 5px;
    animation: hoverUp 0.1s linear;
    animation-fill-mode: forwards;
    transition:0.3s;
}
.blogWidgetCalender .today a {
	color:#FFFFFF !important;
	text-decoration: none;
}
.blogWidgetCalender .today:hover{
    box-shadow: #eee 0px 6px 5px;
    animation: hoverUp 0.1s linear;
    animation-fill-mode: forwards;
    transition:0.3s;
}
.calendar_NOW{
    color:#222;
    font-size:12px;
    font-weight:700 !important;
    text-align:center !important;
}
.WidgetName{
    font-size:18px;
    font-weight:700;
    width:100%;
    text-align:center;
    line-height:18px;
}
.spacerBlack{
    height:2px;
    width:60px;
    margin:8px auto 15px; 
    background:#222;
    top:25px;
    left:50%;
}
/*latestPosts*/
.latestPosts-box{
    width:100%;
    /*display : -webkit-box; 
    display : -webkit-flex; 
    display : -ms-flexbox;
    display : flex;*/
    display:block;
    background:#efefef;
    border-radius:4px;
    margin:7px auto;
    padding:0;
    flex-wrap:nowrap;
    height:70px;
    position:relative;
    transition:0.3s;
}
.latestPosts-box:hover{
    box-shadow: #eee 0px 3px 4px;
    animation: hoverUp 0.1s linear;
    animation-fill-mode: forwards;
    transition:0.3s;
}
.latestPosts-box img{
    display:block;
    width:70px;
    height:70px;
    border-radius:4px 0 0 4px;
    float:left;
    object-fit: cover;

}
.latestPosts-box p{
    display:block;
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:70px;
    font-weight:700;
    color:#222;
    font-size:11px;
    line-height:12px;
    text-decoration:none;
    font-family: 'Meiryo','Noto Serif',sans-serif;
    padding:15px 10px 15px 80px;
    box-sizing:border-box;
    margin:0;
    overflow:hidden;
}
.widget-blog-recent-entries a{
    text-decoration:none;
}

/*monthly*/
.monthlyArchive-year{
    display:block;
    width:100%;
    padding: 8px 15px 6px;
    margin-bottom: 5px;
    border-radius: 4px;
    background-color: #7e7e7e;
    color: #fafafa;
    overflow:hidden;
    font-size: 13px;
    line-height: 100%;
    font-family: 'Meiryo','Noto Serif',sans-serif;
    box-sizing:border-box;
}
.monthlyArchive-month{
    width:100%;
    padding:0;
    margin-bottom:3px;
    -webkit-transition: all .2s ease;
    -moz-transition: all .2s ease;
    -o-transition: all .2s ease;
    transition: all 0.2s ease;
    border-radius: 4px;
}
.monthlyArchive-month a{
    font-family: 'Meiryo','Noto Serif',sans-serif;
    width:100%;
    display: block;
    padding: 8px 15px 7px;
    border-radius: 4px;
    background-color: #efefef;
    color: #222 !important;
    overflow: hidden;
    text-decoration: none;
    font-size: 13px !important;
    line-height: 100%;
    box-sizing:border-box;

}
.monthlyArchive-month:hover{
    box-shadow: #ccc 0px 1px 4px;
    animation: hoverUp 0.1s linear;
    animation-fill-mode: forwards;
    transition:0.3s;
}
@media screen and (max-width:790px) {
    .sideNav{
        display:none;
    }
}
/*
============================================================
//Pagination
============================================================
*/
.blogPagination{
    display:block;
    padding: 20px 0;
    border: 2px solid #efefef;
    text-align: center;
    width:100%;
    box-sizing:border-box;
}
.blogPagination .blogPagination_button a{
    display: inline-block;
    padding: 8px 12px 7px !important;
    border-radius: 4px;
    background-color: #efefef;
    font-weight: 700;
    color: #000;
    font-size: 14px;
    line-height: 100%;
    text-decoration: none !important;
    -webkit-transition: all .2s ease;
    -moz-transition: all .2s ease;
    -o-transition: all .2s ease;
    transition: all 0.2s ease;
}
.blogPagination .blogPagination_button a:hover{
    box-shadow: #ccc 0px 3px 6px;
    animation: hoverUp 0.1s linear;
    animation-fill-mode: forwards;
    transition:0.3s;
    background:#555555;
    color:#fff !important;
}
.blogPagination_button-dis{
    display: inline-block;
    padding: 7px 10px 6px;
    border-radius: 4px;
    border: solid 1px #efefef;
    font-weight: 700;
    color: #d0d0d0;
    font-size: 14px;
    line-height: 100%;
    text-decoration: none;
}
.blogPagination_position{
    display: inline-block;
    padding: 8px 20px 7px;
    color: #222;
    font-size: 14px;
    line-height: 100%;
    letter-spacing: 0.1em;
}
@media screen and (max-width:790px) {
    .blogPagination{
        border:none;
    }
}
.contentsNavi .next-link {
	float: right;
	transition:0.2s;
}
.contentsNavi .prev-link {
	float: left;
	transition:0.2s;
}
.contentsNavi .next-link:hover,.contentsNavi .prev-link:hover{
	color: #e74c3c !important;
	transition:0.2s;
}

/*
============================================================
//dealer
============================================================
*/

.img125Wrapper{
    display : -webkit-box; 
    display : -webkit-flex; 
    display : -ms-flexbox;
    display : flex;
    width:100%;
    flex-direction: row;
    list-style: none;
    justify-content:start;
    padding-inline-start: 0px !important;
    flex-wrap: wrap;
    padding:0 !important;
    text-align:center
}

.img125Wrapper li{
    display:block;
    width:14.2857142%;
    padding:0.632%;
    /*margin:0.632% auto;*/
    box-sizing:border-box;
}
.img125Wrapper li a{
    margin:0;
    padding:0;
    display:block;
    width:100%;
    padding-bottom:100%;
    position:relative;
    background:#fff;
}
.img125Wrapper li a:hover{
    opacity: 0.6;
}
.img125Wrapper li a img{
    display:block;
    position:absolute;
    width:100%;
    height:100%;
    object-fit: contain;
    margin:0;
    padding:0
}

@media screen and (max-width:790px) {
    .img125Wrapper li{
        display:block;
        width:25%;
        padding:1%;
        box-sizing:border-box;
    }
}
@media screen and (max-width:580px) {
    .img125Wrapper li{
        display:block;
        width:33.33333%;
        padding:2%;
        box-sizing:border-box;
    }
}
@media screen and (max-width:480px) {
    .img125Wrapper{
       width:80%;
       margin:0 auto;
    }
    .img125Wrapper li{
        display:block;
        width:50%;
        padding:2%;
        box-sizing:border-box;
    }
}
/*
============================================================
//partners
============================================================
*/
.PartnersInfo {
    width: 99%;
    margin:0 auto 30px;
    padding: 5px 30px;
    box-sizing:border-box;
    border: 1px solid #eeeeee;
    border-radius: 5px;
    background-color: #fefefe;
    color: #222;
    font-family: "Roboto",sans-serif;
    font-size: .707em;
    line-height: 200%;
    text-align: center;
}
/*
============================================================
//company
============================================================
*/
.section_box{
    margin-bottom: 60px;
}
.section_box h1{
    position: relative;
    padding: 10px 0;
    margin: 0 0 30px;
    font-family: "Roboto",sans-serif;
    font-weight: 400;
    font-size: 1.414em;
    text-align: center;
}
.section_box h1:before{
    display: block;
    position: absolute;
    width: 200px;
    height: 1px;
    left: 50%;
    bottom: 0;
    margin-left: -100px;
    background-color: #cccccc;
    content: "";
}
.section_box h1:after{
    top: 0;
    display: block;
    position: absolute;
    width: 200px;
    height: 1px;
    left: 50%;
    margin-left: -100px;
    background-color: #cccccc;
    content: "";
}
.section_box p{
    color: #222;
    font-family: "Roboto",sans-serif;
    font-size: 16px;
    line-height: 200%;
    text-align: justify;
    -webkit-column-count: 2;
    -moz-column-count: 2;
    -ms-column-count: 2;
    -o-column-count: 2;
    column-count: 2;
    -webkit-column-gap: 40px;
    -moz-column-gap: 40px;
    -ms-column-gap: 40px;
    -o-column-gap: 40px;
    column-gap: 40px;
}
@media screen and (max-width:880px) {
    .section_box h1{
        padding: 0 10px 10px;
        font-family: "Roboto",sans-serif;
        font-size: 22.6px;
        line-height: 180%;
        text-align: justify;
        letter-spacing: 0.03em;
        font-weight: 700;
        margin:0;
    }
    .section_box h1:before{
        display:none;
    }
    .section_box h1:after{
        display:none;
    }
    .section_box p{
        -webkit-column-count: 1;
        -moz-column-count: 1;
        -ms-column-count: 1;
        -o-column-count: 1;
        column-count: 1;
        -webkit-column-gap: 0px;
        -moz-column-gap: 0px;
        -ms-column-gap: 0px;
        -o-column-gap: 0px;
        column-gap: 0px;
        font-size: 16px;
        line-height: 180%;
        text-align: justify;
        margin:0;
        padding:0 10px;
    }
    .section_box {
        padding-bottom: 30px;
        margin:0;
        padding-top:10px;
    }
}

/*
============================================================
//CONTACT
============================================================
*/

.contact_info {
    margin: 0 0 40px;
    padding: 15px 0;
    border-top: 1px solid #eee;
    border-bottom: 1px solid #eee;
    font-family: "Roboto",sans-serif;
    text-align: center;
    width:100%;
}
.contact_info dl {
    margin:0;
}
.contact_info dt {
    display: inline-block;
    padding: 0 5px 0 5px;
    font-weight: 700;
    margin:0;
}
.contact_info dd {
    display: inline-block;
    padding: 0 5px 0 0;
    font-weight: 400;
    margin:0;
}
.group_field_name{
    width:100%;
    font-size:15px;
    padding:5px;
}
.contact_formArea{
    width:100%;
    display : -webkit-box; 
    display : -webkit-flex; 
    display : -ms-flexbox;
    display : flex;
    justify-content: space-between;
    flex-direction: row;
    flex-wrap: wrap;
}

.contact_formArea .Name{
    display:block;
    width:49%;
    margin:0;
    padding:10px 0 10px;
}
.contact_formArea .Name input{
    width: 100%;
    padding: 6px 10px;
    box-sizing: border-box;
    border: 1px solid #eeeeee;
    font-family: "Roboto",sans-serif;
    font-size: 1em;
    line-height: 100%;
    border-radius:1px;
}
.contact_formArea .Email{
    display:block;
    width:49%;
    margin:0;
    padding:10px 0 10px;
}
.contact_formArea .Email input{
    width: 100%;
    padding: 6px 10px;
    box-sizing: border-box;
    border: 1px solid #eeeeee;
    font-family: "Roboto",sans-serif;
    font-size: 1em;
    line-height: 100%;
    border-radius:1px;
}
.contact_formArea .Subject{
    display:block;
    width:100%;
    margin:0;
    padding:10px 0 20px;
}
.contact_formArea .Subject input{
    width: 100%;
    padding: 6px 10px;
    box-sizing: border-box;
    border: 1px solid #eeeeee;
    font-family: "Roboto",sans-serif;
    font-size: 1em;
    line-height: 100%;
    border-radius:1px;
}
.contact_formArea .Message{
    display:block;
    width:100%;
    margin:0;
}
.contact_formArea .Message textarea{
    width: 100%;
    padding: 6px 10px;
    box-sizing: border-box;
    border: 1px solid #eeeeee;
    font-family: "Roboto",sans-serif;
    font-size: 1em;
    line-height: 140%;
    resize: vertical;
}
.contact_formArea span{
    font-size:11.3px;
}
.contact_formArea span .required{
    display: inline-block;
    margin-left: 5px;
    padding: 3px 5px 2px;
    border-radius: 3px;
    background-color: #f55165;
    color: #fff;
    line-height:11px;
}
.fname_Name{
    display:block;
    width:100%;
    margin:0 0 10px 0;
    font-weight:700;
}
.fname_Email{
    display:block;
    width:100%;
    margin:0 0 10px 0;
    font-weight:700;
}
.fname_Subject{
    display:block;
    width:100%;
    margin:0 0 10px 0;
    font-weight:700;
}
.fname_Message{
    display:block;
    width:100%;
    margin:0 0 10px 0;
    font-weight:700;
}
.form-description{
    margin-top: 5px;
    color: #999999;
    font-family: "Roboto",sans-serif;
    font-weight: 400;
}
.submitBtn{
    width:100%;
    padding:0;
    margin-top:20px;
}
.submitBtn input{
    width: 100%;
    padding: 15px 0;
    font-weight: 700;
    border: none;
    background-color: #448dd5;
    color: #fff;
    cursor: pointer;
    border-radius:0;
    transition:0.1s;
    font-size:16px;
    line-height:16px;
    margin:0;
}
.submitBtn input:hover{
    opacity:0.9;
    transition:0.1s;
}
@media screen and (max-width:770px) { 
    .contact_formArea .Name{
        width:100%;
    }
    .contact_formArea .Email{
        width:100%;
    }
    .contact_info dl {
        margin:0;
        text-align:center;
    }
    .contact_info dt {
        width:100%;
        padding:0;
    }
    .contact_info dd {
        display: inline-block;
        padding: 0 5px 0 0;
        font-weight: 400;
        margin:0;
        width:100%;
        padding:0;
    }
}