BODY {
    margin: 0;
    height: 100%;
}

html {
    height: 100%;
}
.wrap {
    overflow: hidden;
}
a {
    text-decoration: none;
}
ul {
    list-style: none;
    padding-left: 0px;
}
li {
  list-style: none;
}
.title_contents {
    margin-top: 1vw;
    margin-left: 1vw;
    margin-bottom: 0.5vw;
    text-align: center;
}
.top_contents {
    width: 100%;
    height: 100%;
    text-align: center;
}
/* タイトル回り */
.title {
    width: 100%;
    height: auto;
    font-size: 0;
}
.top_image {
    width: 100%;
}
.pmu {

}
.title_parts {
    width: 11vw;
}
.title_parts_pmu {
    width: 10vw;

}

.title_exp {
    margin-bottom: 1vw;
    width: 30vw;
}
.search {
    margin-top: 1vw;
}
.search_select {
    height: 3.39vw;
    margin-right: -0.1vw;
    padding-top: 5px;
    margin-top: -16px;
    font-size: 1.2rem;
}
.search_input {
    height: 2.6vw;
    width: 22vw;
    padding-top: 10px;
}
.search_btn {
    width: auto;
    height: 3.35vw;
    margin-right: 2vw;
    float:right;
}

/* カテゴリ */
.menu {
    width: 100%!important;
    overflow: hidden!important;
    background-color: #d8d6d6!important;
    display: flex!important; /*フレキシブルボックス*/
    justify-content: center!important;
    padding-left: 0!important;
    padding-right: 0!important;
    font-family: 'Noto Sans Japanese'!important;
    text-align: center!important;
    margin-top: 0px!important;
    flex-wrap: wrap;
}

.menu > li {
	padding:20px;
    background-color:#EEEEEE!important;
    list-style: none!important;
    font-size: 1.2vw!important;
    font-weight: 800!important;
    font-family: 'Noto Sans Japanese'!important;
    color: rgb(114, 114, 114)!important;
    width: calc(100% / 11)!important;
    margin-left: -0.2%!important;
    margin-right: -0.2%!important;
    border: solid 0.1vw #cfcfcf!important;
    text-align: center!important; /*センタリングは好みで*/
}
.menu > li a {
    color: rgb(114, 114, 114)!important;
	

}
/* リンク */
.link {
    width: 100vw;
    text-align: center;
    margin-top: 5vw;
    margin-bottom: 5vw;
}
.link_contents {
    width: 15vw;
    margin-left: 1vw;
    margin-right: 1vw;
}
/* メインコンテンツ */
.main {
    width: 55vw;
    margin-left: 22.5vw;
    margin-right: 22.5vw;
    text-align: center;
    margin-bottom: 100px;
}
/* カテゴリ */
.category {
    display: block;
    text-align: center;
    width: 100%;
    height: auto;
    margin-top: 5vw;
    margin-bottom: 5vw;
    justify-content: center;
    margin-left: 6px;
}
.category_contents {
    display: block;
    width: 28%;
    height: 18vw;
    margin-left: 2.5%;
    margin-right: 2.5%;
    margin-bottom: 5%;
    background-color: rgb(236, 234, 234);
    float: left;
}
.category_image {
    text-align: center;
    margin-top: 1vw;
    transition-duration: 0.3s;
    width: 11vw;
    height: 11vw;
}
.category_image:hover {
    transform: scale(1.2);
    transition-duration: 0.3s;
}

.category_text {
    font-size:1.2vw;
    font-weight:800;
    width:100%;
    font-family: 'Noto Sans Japanese';
    color:rgb(114, 114, 114);
}
.howto {
    width:100%;
}
.howto_image {
    width: 100%;
}
/* フッター */
.footer {
    text-align: center;
}
/* フッターのメニュー */
.footer > div  {
    margin-bottom: -16px;
}

/* フッターのメニュー */
.footer > div > .menu {
    width: 100%;
    background-color: #d8d6d6;
    display: flex;
    padding-left: 0;
    padding-right: 0;
    font-family: 'Noto Sans Japanese';
    text-align: center;
    margin-top: 0px;
    margin-left: 300px;
    justify-content: start !important;
}

/* フッターのメニュー */
.footer > div  {
    background-color: rgb(231 231 231);
}


.copylight {
    width: 100%;
    height: 55px;
    background-color: rgb(83, 83, 83)!important;
    text-align: right;
    margin-top: -16px;
}
.copylight_text {
    width: 100%;
    height: 20px;
    margin-right: 10vw;
    color: white;
}
.footer_parts {
    margin-top: 40px;
    margin-left: 36px;
    margin-right: 20px;
    position: absolute;
}
.footer_title_logo {
    width: 100%;
    height: 170px;
}
.blank {
    height: 1px;
    margin-bottom: -8px;
}
.header_pmu_explanation_text {
    font-size: 15px;
    font-weight: 800;
    font-family: 'Noto Sans Japanese';
    color: rgb(114, 114, 114);
    margin-left: 20px;
    line-height: 1.25;
    text-align: center;
}
.sp_header_pmu_explanation_text {
    font-size: 13px;
    font-weight: 600;
    font-family: 'Noto Sans Japanese';
    color: rgb(114, 114, 114);
    display: inline-block;
    margin-left: 20px;
    line-height: 1.25;
    text-align: left;
}


.footer_pmu_explanation_text {
    font-size: 20px;
    font-weight: 800;
    font-family: 'Noto Sans Japanese';
    color: rgb(114, 114, 114);
}
.page_top {
    margin-top: -2vw;
    width: 3.5vw;
    margin-left: 40vw;
    position: absolute;
    cursor: pointer;
}
.footer_menu_list {
    font-size: 24px;
    font-weight: 800;
    font-family: 'Noto Sans Japanese';
    color: rgb(114, 114, 114);
    margin-right: 2vw;
    margin-left: 2vw;
    margin-top: 25px;
    margin-bottom: 20px;
    display: inline-block;
}

.sub-menu {
    font-size:10px;
    font-weight:800;
    font-family: 'Noto Sans Japanese';
    color:rgb(114, 114, 114);
    padding-left: 0;
    padding-right: 20px;
}
.footer_menu_list a {
    color:rgb(114, 114, 114);
}

.searchandfilter li {
    font-size: 16px;
    font-family: 'Noto Sans Japanese';
}

/* search & filter */
.searchandfilter li{
    list-style: none;
    margin-bottom: 1em;
    padding-right: 0px !important;
}
.widget-area .searchandfilter li, .widget-area .searchandfilter p{
    display:block;
}
.searchandfilter{
    text-align: center;
    margin-right: 10px;
}
/* 選択プルダウン */
select {
    height: 48px;
    margin-right: -1px;
    background-color: #f6f6f6;
    font-family: 'Noto Sans Japanese';
    font-size: 20px;
}
/* テキスト入力 */
input[type="text"][name="ofsearch"]{
    height: 44px;
    width: 50vw;
    font-family: 'Noto Sans Japanese';
    font-size: 20px;
    border-radius: 0;
    border-width: thin;
}
/* 検索ボタン */
input[type="submit"]{
    background-image: url(../pc_img/search_btn.png);
    background-repeat: no-repeat;
    height: 51px;
    text-indent: 130%;
    cursor: pointer;
    background-size: 86%;
    border: none;
}
/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ー */

/* SP表示用 */
@media screen and (max-width:500px) {
    .title_parts {
        width: 30vw;
    }
    .title_parts_pmu {
        width: 15vw;
        margin-right: 1vw;
    }
    html {
        margin-top: 0px !important;
        margin-right: 0;
    }
    .search {
        float: right;
        text-align: right;
        margin-top: 1vw;
        width: 100%;
    }
    /* search & filter */
    .searchandfilter li{
        list-style: none;
        margin-bottom: 1em;
        padding-right: 0px !important;
    }
    .searchandfilter ul {
        width: 100%;
        padding-left: 0;
    }
    .widget-area .searchandfilter li, .widget-area .searchandfilter p{
        display:block;
    }
    .searchandfilter{
        text-align: center;
        margin-right: 10px;
    }
    /* 選択プルダウン */
    select {
        height: 29px;
        width: 20vw;
        background-color: #f6f6f6;
        font-family: 'Noto Sans Japanese';
        font-size: 13px;
        margin-left: -5vw;
    }
    /* テキスト入力 */
    input[type="text"][name="ofsearch"]{
    width: 63vw;
    height: 25px;
    font-family: 'Noto Sans Japanese';
    font-size: 13px;
    margin-left: -8.7vw;
    border-radius: 0;
    border-width: thin;
    }
    /* 検索ボタン */
    input[type="submit"]{
    background-image: url(../pc_img/search_btn.png);
    background-repeat: no-repeat;
    text-indent: 130%;
    cursor: pointer;
    margin-left: 21.3vw;
    height: 29.8px;
    width: 30px;
    background-size: 100%;
    border: none;
    }
    .your-class {
        width: 100vw;
        height: 100vw;
    }
    /* カテゴリ */
    .menu {
    width: 100%;
    background-color: #d8d6d6;
        justify-content: unset;
        padding-left: 0;
        padding-right: 0;
        font-family: 'Noto Sans Japanese';
        text-align: none;
        margin-top: -178px;
        height: 2;
        flex-wrap: wrap;
    }
    .menu_contents {
        width: 33.2vw;
        height: 15vw;
        margin-left: -0%;
        margin-right: -0%;
        border: solid 0.1vw #cfcfcf;
        display: flex; /*フレキシブルボックス*/
    }
    .menu_contents li {
        height: auto;
        width: auto;
    }
	
    .footer_menu_list {
        font-size: 12px;
        font-family: 'Noto Sans Japanese';
        color: rgb(216 216 216);
        margin-right: 1vw;
        margin-left: 1vw;
        margin-top: 25px;
        margin-bottom: 0px;
        display: inline-block;
        width: 20vw;
    }
    li {
        width: 33.2%;
        z-index: 100;
    }
    li + li {
        width: 33.2%;
        margin-top: 0px;
        z-index: 100;
    }
    li {
        width: 33.2%;
    }
    li + li {
        width: 33.2%;
        margin-top: 0px;
    }
    .sub-menu {
        font-size:10px;
        font-weight:800;
        font-family: 'Noto Sans Japanese';
        color:rgb(114, 114, 114);
        padding-left: 0;
        padding-right: 20px;
        height: 110px;
    }
    .footer_pmu_explanation_text {
        font-size: 12px;
        font-weight: 800;
        font-family: 'Noto Sans Japanese';
        color: rgb(114, 114, 114);
        margin-top: 0px;
    }
    .footer_title_logo {
        width: 100%;
        height: 85px;
    }
    a > .footer_logo {
        width: 25vw;
        margin-top: 15px;
    }
    .copylight_text {
        width: 100%;
        height: 20px;
        margin-right: 10vw;
        color: #d8d6d6;
        font-size: 12px;
    }
    .copylight {
        width: 100%;
        height: 55px;
        background-color: rgb(83, 83, 83)!important;
        text-align: center;
        margin-top: -16px;
    }
    .blank {
        height: 1px;
        margin-bottom: -5px;
    }
    .page_top {
        margin-top: -5vw;
        width: 8.5vw;
        margin-left: 38vw;
        position: absolute;
        cursor: pointer;
    }
}
BODY {
    margin: 0
}
.sp_title_contents {
    width: 103%;
    margin-left: -2vw;
    margin-bottom: 0.5vw;
}
.sp_top_contents {
    width: 100%;
    height: 100%;
    text-align: center;
}
/* タイトル回り */
.sp_title {
    width: 100%;
    height: 268px;
    font-size: 0;
}
.sp_top_image {
    width: 100%;
}
.sp_pmu {

}
.sp_title_parts {
    width: 100px;
	margin-right: 10px;
    margin-left: 6vw;
}
.sp_title_parts_pmu {
    width: 100px;
}

.sp_title_exp {
    width: 357px;
    margin-top: 4vw;
    margin-left: 4vw;
    margin-right: 2vw;
    margin-bottom: 1vw;
    float: left;
}
.sp_search {
    float: right;
    text-align: right;
    margin-top: 1vw;
}
.sp_search_select {
    height: 3.3vw;
    width: 5vw;
    bottom: 10vw;
    margin-bottom: -9vw;
    margin-right:-0.1vw;
    font-size: 1.5rem;
}
.sp_search_input {
    height: 3.3vw;
    width: 22vw;
}
.sp_search_btn {
    width: auto;
    height: 3.35vw;
    margin-right: 2vw;
    float:right;
}

/* カテゴリ */
   	.sp_menu {
    overflow: hidden;
    display: flex; /*フレキシブルボックス*/
    justify-content: center;
    padding-left: 0;
    padding-right: 0;
    text-align: center;
    margin-top: 0px;
    flex-wrap: wrap;
}

.sp_menu div ul li {
    display: flex;
    align-items: center;
    justify-content: center;
    width: calc(100% / 3)!important;
    font-size:  2.2vw!important;
    font-family: '游ゴシック'!important;
	
}


/* リンク */
.sp_link {
    text-align: center;
    margin-top: 5vw;
    margin-bottom: 5vw;
}
.sp_link_contents {
    margin-left: 1vw;
    margin-right: 1vw;
    margin-bottom: 2vw;
    width: 165px;
}
/* メインコンテンツ */
.sp_main {
    width: 100vw;
    height: auto;
    text-align: center;
    margin-left: 1.5vw;
}
/* カテゴリ */
.sp_category {
    text-align: center;
    width: 100%;
    height: auto;
    margin-top: 5vw;
    margin-bottom: 5vw;
    justify-content: center;
}
.sp_category_contents {
    width: 30vw;
    height: 45vw;
    margin-right: 2vw;
    margin-bottom: 2vw;
    background-color: rgb(236, 234, 234);
    float: left;
    margin-bottom: 10vw;
}
.sp_category_image {
    text-align: center;
    width: 100%;
    height: auto;
    margin-top: 5vw;
}
.sp_category_text {
    font: italic;
    margin-top: 0px;
    font-weight: 800;
    font-size: 3vw;
    width:100%;
    font-family: 'Noto Sans Japanese';
    color:rgb(114, 114, 114);
}
.sp_howto {
    width:100%;
}
.sp_howto_image {
    width: 100%;
}
/* フッター */
.sp_footer {
    margin-top: 15vw;
    width:100%;
    height:40vw;
    background-color: rgb(236, 234, 234);
    position: relative;
	padding-bottom: 3rem;
}
.sp_footer_top {
    height: 12vw;
    margin-left: 16.4%;
    padding-top: 20px;
    display: flex;

}
.sp_footer_top li {
    margin-top: 1vw;
}

.sp_footer_under {
    display: flex;
    padding-left: 8px !important;
}

.sp_footer_under li {
    margin-top: 1vw;
}

.sp_copylight {
    width: 100%;
    height: 40px;
    margin-top:10vw;
    background-color: rgb(83, 83, 83);
    text-align:center;
    position: absolute;
bottom: 0;
}
.sp_copylight_text {
    margin-top: 9px;
    width: 100%;
    height: 20px;
    color: white;
    font-size: 0.7rem;
}
.sp_footer_parts {
    width:20vw;
    margin-top:  5vw;
    margin-left: 3vw;
    margin-right: 10vw;
    float: left;
    position: absolute;
}
.sp_page_top {
    margin-top: -5vw;
    width: 35px;
    margin-left: 88vw;
    position: absolute;
}
.sp_footer_menu_list {
    width: 25%;
    height: 40vw;
    float: left;
    list-style: none;
    margin-left: -13vw;
}
.sp_footer_menu_list_4 {
    width: 25%;
    height: 40vw;
    float: left;
    list-style: none;
    margin-left: -3vw;
}

/* ハンバーガーメニュー */
#g-nav{
    /*position:fixed;にし、z-indexの数値を大きくして前面へ*/
    position:fixed;
    z-index: 999;
    /*ナビのスタート位置と形状*/
  top:-120%;
    left:0;
  width:100%;
    /*動き*/
  transition: all 0.6s;
}

/*アクティブクラスがついたら位置を0に*/
#g-nav.panelactive{
    top: 0;
}

/*ナビゲーションの縦スクロール*/
#g-nav.panelactive #g-nav-list{
    /*ナビの数が増えた場合縦スクロール*/
    position: fixed;
    z-index: 999; 
    width: 100%;
    height: 100vh;/*表示する高さ*/
    overflow: auto;
    -webkit-overflow-scrolling: touch;
}

/*ナビゲーション*/
#g-nav ul {
    /*ナビゲーション天地中央揃え*/
    position: absolute;
    z-index: 999;
    top: 50%;
    left: 50%;
    width: 134%;
    transform: translate(-50%,-50%);
}

/*リストのレイアウト設定*/

#g-nav li{
  list-style: none;
    text-align: left;
    width: 100%;
    border-bottom: 1px solid #a3a3a3;
}
#g-nav li:last-child{
    border-bottom: none;
  }

#g-nav li a{
  color: #333;
  text-decoration: none;
  padding:10px;
  display: block;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  font-weight: bold;
  font-size: 16px;
  margin-top: 20px;
}

/*========= ボタンのためのCSS ===============*/
.openbtn1{
    position:fixed;
    z-index: 9999;/*ボタンを最前面に*/
    top:10px;
    right: 10px;
    cursor: pointer;
    width: 50px;
    height:50px;
}
/*×に変化*/
.openbtn1 span{
    display: inline-block;
    transition: all .4s;
    position: absolute;
    left: 14px;
    height: 3px;
    border-radius: 2px;
  background-color: #666;
    width: 45%;
  }

.openbtn1 span:nth-of-type(1) {
  top:15px; 
}

.openbtn1 span:nth-of-type(2) {
  top:23px;
}

.openbtn1 span:nth-of-type(3) {
  top:31px;
}

.openbtn1.active span:nth-of-type(1) {
    top: 18px;
    left: 18px;
    transform: translateY(6px) rotate(-45deg);
    width: 30%;
}

.openbtn1.active span:nth-of-type(2) {
  opacity: 0;
}

.openbtn1.active span:nth-of-type(3){
    top: 30px;
    left: 18px;
    transform: translateY(-6px) rotate(45deg);
    width: 30%;
}

#menu-humberger_menu {
    width: 216px;
    height: 641px;
    background-color: none;
    margin-top: 0;
    margin-bottom: 0;
}

.single_contents {
    text-align: left;
    width: 68%;
    margin-left: 16vw;
}
.single_img {
    width: 100%;
}
.single_title {
    margin-top: 65px;
    font-family: 'Noto Sans Japanese';
    color:rgb(114, 114, 114);
    font-weight:800;
    font-size: 30px;
}
.single_text {
    font-family: 'Noto Sans Japanese';
    color:rgb(114, 114, 114);
    font-weight:800;
    font-size: 20px;
}
.iframe_size {
    width: 100%;
    height: 758px;
}

.contents {
    width: 100%;
    overflow: hidden;
}
.item  {
	width: 76%;
    float: left;
    margin-right: 20px;
    text-align: center;
    }

.item2  {
	width: 20%;
    float: left;
    margin-right: 10px;
    text-align: center;
    }

/*解説文内*/
.descriptList{
	display: -webkit-flex;
    display: flex;
    -webkit-justify-content: space-between;
    justify-content: space-around;
}

.descriptList li{
	width:25%;
}

.descriptTable{
	border:solid 1px #aaaaaa;
	border-collapse:collapse;
	width:100%;
}

.descriptTable td{
	border:solid 1px #aaaaaa;
	padding:5px;
	text-align:center;
	width:16%;
}

@media screen and (min-width:767px) {
	.pc_none{
	display:none;
	}
}

@media screen and (max-width:767px) {
    .single_contents {
        text-align: left;
        width: 90%;
        margin-left: 18px;
    }
    .single_img {
        width: 70px;
        height: 75px;
    }
    .single_title {
        margin-top: 35px;
        font-family: 'Noto Sans Japanese';
        color:rgb(114, 114, 114);
        font-weight:800;
        font-size: 20px;
    }
    .single_text {
        font-family: 'Noto Sans Japanese';
        color:rgb(114, 114, 114);
        font-weight:800;
        font-size: 14px;
    }
    .iframe_size {
        width: 100%;
        height: 300px;
    }
	.descriptList{
	display: block;
	}
	.descriptList li{
	width:100%;
	}
	.sp_none{
	display:none;
	}
}