@charset "utf-8";

img{max-width: 100%;}
a{text-decoration: none; transition: .3s;}
a:hover{text-decoration: underline;}
.owner a{color: #1F286F;}
.user a{color: #333333;}
span{display: block;}
body{font-size: 16px; font-family: 'Noto Sans JP', sans-serif;}

/*-- header --*/
header{background-color: #fff; border-bottom: 1px solid #c8cccf;}
header a:hover{text-decoration: none;}
.head_inner{max-width: 1350px; padding: 20px 20px; margin: auto;}
.head_logo{display: flex; align-items: center; flex-wrap: wrap;}
.head_logo span{display: block; font-weight: 600; font-size: 14px; letter-spacing: 1.5px;}
.head_logo img{max-width: 200px; margin-right: 10px;}
.head_nav a{font-size: 14px; display: flex; align-items: center; flex-wrap: wrap;}
.head_nav a img{max-width: 20px; margin-right: 5px;}

/* owner */
.owner .head_logo span{color: #1F286F;}

/* user */
.user .head_logo span{color: #333;}

/*-- mv --*/
.mv{position: relative;}
.mv > img{width: 100%;}
.mv .wrp_search_box{position: absolute; top: 0; bottom: 0; right: 0; left: 0; width: 1000px; height: 160px; margin: auto;}
.mv .wrp_search_box span{color: #fff; text-align: center;}
.mv .wrp_search_box .main{font-size: 21px; margin-bottom: 20px; letter-spacing: 2px;}
.mv .wrp_search_box .search_box{margin-bottom: 25px;}
.mv .wrp_search_box .search_box form{width: 650px; margin: 0 auto;  border-radius: 30px;}
.mv .wrp_search_box .search_box input{border-radius: 30px; padding: 15px 20px;}
.mv .wrp_search_box .search_box button{right: 20px;}
.mv .wrp_search_box .search_box button i{font-size: 24px;}
.mv .wrp_search_box .search_cat span{margin-right: 10px;}
.mv .wrp_search_box .search_cat a{color: #fff; display: inline-block; margin: 0 5px; border-radius: 15px; line-height: 1; padding: 7px 15px; border: 1px solid #fff; font-size: 12px;}
.owner .mv .wrp_search_box .search_cat a:hover{background-color: #1f286f; text-decoration: none; border: 1px solid #1f286f;}
.user .mv .wrp_search_box .search_cat a:hover{background-color: #333; text-decoration: none; border: 1px solid #333;}


/*-- public --*/
main{padding-bottom: 100px;}
.container.v-help{max-width: 1350px;}
.bread{padding-top: 20px;}
.bg_gray{background-color: #EEEFF3;}
.wrp_over_main{display: flex; align-items: flex-start; padding-top: 80px; margin-bottom: 70px;}
.wrp_over_main .left_side{width: 25%; padding: 30px 20px;}
.owner .wrp_over_main .left_side{background-color: #EEEFF3;}
.user .wrp_over_main .left_side{background-color: #EEEEEE;}
.wrp_over_main .main_box{width: 75%; padding-left: 70px;}
.search_box form{background-color: #fff; border-radius: 30px; position: relative;}
.search_box input{width: 100%; border: 0px solid #000; border-radius: 30px; padding: 10px 15px;}
.search_box button{border: none; background-color: transparent; position: absolute; top: 0; right: 10px; bottom: 0; margin: auto 0;}
.search_box button i{margin-right: 0; font-size: 16px;}

/* section */
.sec_inner{padding: 80px 0;}
.sec_inner.pb0{padding-bottom: 0;}
.sec_title{display: flex; align-items: center; font-size: 30px; margin-bottom: 40px;}
.sec_title.center{justify-content: center;}
.sec_title img{margin-right: 15px; max-width: 30px;}

/* sidebar */
.left_side .search_box{margin-bottom: 30px;}
.left_side .side_box{margin-bottom: 30px;}
.left_side .side_box .item_tit{text-align: center; margin-bottom: 20px; font-weight: bold;}
.left_side .side_box .key_box{display: flex; flex-wrap: wrap;}
.left_side .side_box .key_box a{display: block; font-size: 12px; padding: 5px 20px; border-radius: 15px; font-weight: bold; margin-bottom: 10px; margin-right: 10px;}
.left_side .side_box .first_box a{display: block; margin-bottom: 15px; font-size: 14px; position: relative; padding-left: 15px;}
.left_side .side_box .first_box a::before{font-family: "Font Awesome 5 Free"; content: "\f105"; width: 20px; position: absolute; top: 0; left: 0; font-weight: bold;}

/* main-box */
.main_box .main_title{font-size: 30px; font-weight: bold; display: flex; align-items: center; margin-bottom: 50px;}
.main_box .main_title h1{margin-bottom: 0; font-size: 30px;}
.main_box .main_title img{max-width: 50px; margin-right: 15px;}
.main_default li,.main_default_two li{padding-bottom: 20px; margin-bottom: 20px; border-bottom: 1px solid #C5CCD4;}
.main_default li a,.main_default_two li a{color: #333333;}
.main_default li a{padding-left: 20px; position: relative; line-height: 1;}
.main_default li a::before{font-family: "Font Awesome 5 Free"; content: "\f105"; width: 20px; position: absolute; top: 0; left: 0; font-weight: bold;}

/* bottom-box */
.help_title{font-size: 27px; font-weight: 600; text-align: center; margin-bottom: 50px;}
.main_default_two{display: flex; justify-content: space-between; flex-wrap: wrap; align-items: flex-end;}
.main_default_two li{width: 49%;}
.main_default_two li a{display: flex; align-items: center;}
.main_default_two li .q{display: inline-block; margin-right: 15px; font-weight: bold; font-size: 21px; font-family: sans-serif;}

/* single */
.main_box .single_title{margin-bottom: 40px; display: flex; flex-wrap: wrap; align-items: center;}
.main_box .single_title h1{display: inline-block; font-size: 30px; font-weight: bold; margin-bottom: 0; margin-right: 10px;}
.main_box .single_title .cat{font-size: 14px; color: #fff; line-height: 1; padding: 5px 15px 5px; font-weight: bold;}
.main_box .single_title .cat > a{color: #fff;}
.main_box .single_content p{font-size: 14px; margin-bottom: 15px;}
.main_box .single_content h2{font-size: 24px; font-weight: bold; margin-bottom: 20px;}
.main_box .single_content h3{font-size: 21px; font-weight: bold; margin-bottom: 20px;}
.main_box .single_content img{margin-bottom: 20px;}
.helpful{border: 0px solid #000 !important; box-shadow: 0 0 0 !important; margin-bottom: 40px;}
.helpful .helpful-controls{justify-content: center;}
.helpful-content{text-align: center;}
.helpful > .helpful-controls > div{text-align: center; width: auto !important;}
.helpful > .helpful-controls > div > .helpful-button[data-value="pro"],
.helpful > .helpful-controls > div > .helpful-button[data-value="contra"]
{border-left: 0px; background-color: transparent; text-align: center; display: inline-block; width: 230px; padding: 10px 0px; border-radius: 5px; height: auto; position: relative; padding-left: 15px;}
.helpful > .helpful-controls > div > .helpful-button[data-value="pro"]::before{font-family: "Font Awesome 5 Free"; content: "\f00c"; width: 20px; height: 15px; position: absolute; top: 0; bottom: 0; margin: auto; left: 50px; font-weight: bold;}
.helpful > .helpful-controls > div > .helpful-button[data-value="contra"]::before{font-family: "Font Awesome 5 Free"; content: "\f00d"; width: 20px; height: 15px; position: absolute; top: 0; bottom: 0; margin: auto; left: 30px; font-weight: bold;}
.helpful > .helpful-controls > div > .helpful-button > .helpful-counter{display: none !important;}
.main_box .single_ba{display: flex; justify-content: space-between;}
.main_box .single_ba a{display: block; width: 45%; overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; position: relative;}
.main_box .single_ba a::before{font-family: "Font Awesome 5 Free"; width: 20px; height: 21px; position: absolute; top: 0; bottom: 0; margin: auto; font-weight: bold;}
.main_box .single_ba a:first-of-type{padding-left: 30px;}
.main_box .single_ba a:nth-of-type(2){text-align: right; padding-right: 30px;}
.main_box .single_ba a:first-of-type::before{content: '\f060'; left: 0;}
.main_box .single_ba a:nth-of-type(2)::before{content: '\f061'; right: 0; height: 22px;}

/* pagination */
.wrp_pagination{margin-top: 30px;}
.wrp_pagination ul{display: flex; justify-content: center;}
.wrp_pagination ul li{margin: 0 3px;}
.wrp_pagination ul .page-numbers{padding: 15px 17px; font-weight: bold; font-size: 12px; display: block;}
.wrp_pagination ul .page-numbers i{margin-right: 0;}
.wrp_pagination ul .page-numbers.dots{border: 0px solid #000 !important;}
.wrp_pagination .nav-links{width: 100%;}
.wrp_pagination ul li .next{margin-left: 30px;}
.wrp_pagination ul li .prev{margin-right: 30px;}
.wrp_pagination a:hover{text-decoration: none; opacity: 1;}

.owner .wrp_pagination ul .page-numbers{border: 1px solid #CCCCCC; color: #1F286F;}
.owner .wrp_pagination ul a.page-numbers:hover{border: 1px solid #1F286F; background-color: #1F286F; color: #fff;}
.owner .wrp_pagination ul .page-numbers.current{background-color: #1F286F; color: #fff;}
.user .wrp_pagination ul .page-numbers{border: 1px solid #CCCCCC; color: #333333;}
.user .wrp_pagination ul a.page-numbers:hover{border: 1px solid #939393; background-color: #939393; color: #fff;}
.user .wrp_pagination ul .page-numbers.current{background-color: #939393; color: #fff;}


/* bread */
.bread{display: flex; font-size: 12px;}
.bread span{margin: 0 5px; font-weight: bold; overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1;}
.bread span > a > span{color: #ccc !important; font-weight: normal;}
.bread span:first-of-type{margin-left: 0;}
.owner .bread span{color: #1F286F;}
.user .bread span{color: #000;}


/* about */
.wrp_about .item{background-color: #fff; padding: 30px 30px 20px; border-radius: 10px;}
.wrp_about .item_tit{display: flex; align-items: center; font-size: 30px; margin-bottom: 20px;}
.wrp_about .item_tit img{margin-right: 10px; max-height: 25px;}
.wrp_about .item_tit img.ajust{max-height: 35px;}
.wrp_about ul{margin-bottom: 15px;}
.wrp_about ul li{margin-bottom: 10px; font-size: 14px;}
.wrp_about ul li a{padding-left: 20px; position: relative; color: #333; display: block;}
.wrp_about ul li a::before{font-family: "Font Awesome 5 Free"; content: "\f105"; width: 20px; position: absolute; top: 0; left: 0; font-weight: bold;}
.wrp_about .box_more{text-align: right; font-size: 14px; font-weight: bold;}
.wrp_about .box_more i{margin-right: 0px; margin-left: 7px;}

/* 404 */
.not.container{max-width: 900px;}
.not_box{padding-bottom: 30px; margin-bottom: 50px; border-bottom: 1px solid #C5CCD4;}
.not_box .item_tit{font-size: 39px; letter-spacing: 4px; font-weight: bold; margin-bottom: 40px;}

/*-- top --*/
/* owner */
.owner .sec_title{color: #1F286F;}
.wrp_first{margin-bottom: 60px;}
.wrp_first a{display: block; position: relative;}
.wrp_first a img{width: 100%; height: auto;}
.wrp_first a .item_tit{position: absolute; bottom: 10px; left: 10px; color: #fff; background-color: rgba(0,0,0,0.6); line-height: 1; padding: 5px 5px 7px; font-size: 18px; overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1;}
.owner .wrp_about .item_tit{color: #1F286F;}
.owner .wrp_about ul li a::before{color: #1F286F;}
.owner .wrp_about .box_more .view_more{color: #1F286F;}

/* user */
.user .wrp_about .item_tit{color: #333333;}
.user .wrp_about ul li a::before{color: #333333;}
.user .wrp_about .box_more .view_more{color: #333333;}

/*-- owner-archive --*/
.owner .left_side .search_box button i{color: #1F286F;}
.owner .left_side .search_box input{border: 1px solid #c8cbd0;}
.owner .left_side .search_box input::placeholder{color: #c7ccd2;}
.owner .left_side .side_box .item_tit{color: #1F286F;}
.owner .left_side .side_box .key_box a{color: #1F286F; border: solid 1px #1F286F;}
.owner .left_side .side_box .key_box a:hover{color: #fff; background-color: #1F286F; text-decoration: none;}
.owner .left_side .side_box .first_box a::before{color: #1F286F;}
.owner .main_box .main_title{color: #1F286F;}
.owner .help_title{color: #1F286F;}
.owner .main_default li a::before{color: #1F286F;}
.owner .main_default_two li .q{color: #656A94;}

/*-- user-archive --*/
.user .left_side .search_box button i{color: #333333;}
.user .left_side .search_box input{border: 1px solid #c8cbd0;}
.user .left_side .search_box input::placeholder{color: #c7ccd2;}
.user .left_side .side_box .item_tit{color: #333333;}
.user .left_side .side_box .key_box a{color: #333333; border: solid 1px #333333;}
.user .left_side .side_box .key_box a:hover{color: #fff; background-color: #333333; text-decoration: none;}
.user .main_box .main_title{color: #333333;}
.user .help_title{color: #333333;}
.user .main_default li a::before{color: #333333;}
.user .main_default_two li .q{color: #939393;}

/*-- owner-single --*/
.owner .main_box .single_title{color: #1F286F;}
.owner .main_box .single_title .cat{background-color: #1F286F;}
.owner .main_box .single_content h2{color: #1F286F;}
.owner .main_box .single_content h3{color: #1F286F;}
.owner .helpful{background-color: #EEEFF3;}
.owner .helpful > .helpful-controls > div > .helpful-button{border: solid 1px #1F286F !important; color: #1F286F;}
.owner .helpful > .helpful-controls > div > .helpful-button[data-value="pro"]::before{color: #1F286F;}
.owner .helpful > .helpful-controls > div > .helpful-button[data-value="contra"]::before{color: #1F286F;}

/*-- user-single --*/
.user .main_box .single_title{color: #333333;}
.user .main_box .single_title .cat{background-color: #939393;}
.user .main_box .single_content h2{color: #333333;}
.user .main_box .single_content h3{color: #333333;}
.user .helpful{background-color: #EEEEEE;}
.user .helpful > .helpful-controls > div > .helpful-button{border: solid 1px #333333 !important; color: #333333;}
.user .helpful > .helpful-controls > div > .helpful-button[data-value="pro"]::before{color: #333333;}
.user .helpful > .helpful-controls > div > .helpful-button[data-value="contra"]::before{color: #333333;}

/*-- owner-404 --*/
.owner .not_box .item_tit{color: #1F286F;}

/*-- user-404 --*/
.user .not_box .item_tit{color: #333333;}

/*-- btn --*/
.box_btn{text-align: center;}
.public_btn:hover{text-decoration: none;}
.public_btn{display: inline-block; border-radius: 30px; padding: 12px 100px; position: relative; font-weight: bold; transition: .3s;}
.public_btn::after{position: absolute; font-family: "Font Awesome 5 Free"; content: "\f105"; font-weight: 900; top: 0; bottom: 0; right: 10px; margin: auto; width: 20px; height: 20px;}

/* owner */
.owner .public_btn{color: #1F286F; border: solid 2px #1F286F;}
.owner .public_btn:hover{background-color: #1F286F; color: #fff;}

/* user */
.user .public_btn{color: #333; border: solid 2px #333;}
.user .public_btn:hover{background-color: #333; color: #fff;}


/*-- footer --*/
.foot_inner{padding: 60px 0; color: #fff;}
.owner .foot_inner{background-color: #656A94;}
.user .foot_inner{background-color: #989898;}
.foot_inner .foot_logo{margin-bottom: 40px; text-align: center;}
.foot_inner .foot_logo img{max-width: 200px;}
.foot_inner .foot_nav{text-align: center;  font-size: 14px;}
.foot_inner .foot_nav a{display: block; color: #fff;}
.foot_inner .foot_nav ul{display: flex; justify-content: center; margin-bottom: 20px; flex-wrap: wrap;}
.foot_inner .foot_nav ul li{margin: 0 10px 10px;}
footer .copy{color: #fff; font-size: 10px; text-align: center; padding: 10px 0;}
footer.owner .copy{background-color: #1F286F;}
footer.user .copy{background-color: #333333;}

/*------PC3------*/
@media only screen and (max-width: 1580px) {

  .container.v-help{max-width: 1150px;}
  .left_side .side_box .key_box a{padding: 5px 10px;}
  
}
  
/*------PC2------*/
@media only screen and (max-width: 1440px) {

}


/*---PAD pro---*/
@media only screen and (max-width: 1050px) {


  /* mv */
  .mv .wrp_search_box{max-width: 100%;}
  .mv .wrp_search_box .search_box form{max-width: 100%;}

  /*-- public --*/
  .wrp_over_main .left_side{width: 30%;}
  .wrp_over_main .main_box{padding-left: 30px; width: 70%;}
  
}
  
/*---PAD-ad---*/
@media only screen and (max-width: 991.98px) {
  /* single */
  .helpful{padding-left: 15px !important; padding-right: 15px !important;}
  .helpful .helpful-controls > div:first-child{margin-right: 0 !important;}
  .helpful .helpful-controls{flex-direction: row !important;}
  .helpful > .helpful-controls > div > .helpful-button[data-value="pro"],
  .helpful > .helpful-controls > div > .helpful-button[data-value="contra"]
  {width: 150px; font-size: 14px; margin: 0 3px;}
  .helpful > .helpful-controls > div > .helpful-button[data-value="pro"]::before{left: 10px;}
  .helpful > .helpful-controls > div > .helpful-button[data-value="contra"]::before{left: 5px;}
}

/*---PAD---*/
@media only screen and (max-width: 880px) {
  body{font-size: 14px;}

  /* mv */
  .mv .wrp_search_box{height: 155px;}
  .mv .wrp_search_box{width: 500px;}
  .mv .wrp_search_box .search_box form{width: 450px;}
  .mv .wrp_search_box .main{font-size: 16px; margin-bottom: 15px;}
  .mv .wrp_search_box .search_box input{padding: 10px 15px;}
  .mv .wrp_search_box .search_box{margin-bottom: 20px;}
  .mv .wrp_search_box .search_cat a{padding: 7px 10px;}
  .mv .wrp_search_box .search_cat a:nth-of-type(n+4){display: none;}

  /*-- public --*/
  /* section */
  .sec_title{font-size: 24px;}
  .sec_title img {margin-right: 10px; max-width: 20px;}

  /* about */
  .wrp_about .item{padding: 30px 20px 20px;}
  .wrp_about .item_tit{font-size: 18px;}


  /* btn */
  .public_btn{padding: 10px 70px;}

}
  
/*---Sm---*/
@media only screen and (max-width: 767px) {

  .container.v-help{overflow: hidden;}

  /*-- header --*/
  .head_inner{padding: 15px 15px;}
  .head_logo{max-width: 200px;}
  .head_logo img{margin-right: 0; margin-bottom: 5px;}
  .head_nav a img{margin-right: 0; margin-bottom: 5px;}
  .head_nav a{max-width: 80px; justify-content: center; font-size: 10px;}

  /* bread */
  .bread{flex-wrap: wrap;}
  .bread span{margin: 0; margin-bottom: 2px;}

  /* mv */
  .mv .wrp_search_box{width: 320px; height: 255px;}
  .mv .wrp_search_box .main{text-align: left;}
  .mv .wrp_search_box .search_box form{width: 310px;}
  .mv .wrp_search_box .search_box input{padding: 12px 15px;}
  .mv .wrp_search_box .search_box button{right: 15px;}
  .mv .wrp_search_box .search_cat span{margin-right: 0; width: 100%; margin-bottom: 20px;}

  /*-- public --*/
  .wrp_over_main{padding-top: 50px; flex-wrap: wrap-reverse;}
  .wrp_over_main .left_side{width: 100%;}
  .wrp_over_main .main_box{width: 100%; padding-left: 0; margin-bottom: 50px;}
  .main_box .main_title{font-size: 21px; margin-bottom: 30px;}
  .main_box .main_title h1{font-size: 21px;}
  .main_box .main_title img{max-width: 30px;}
  .main_default li, .main_default_two li{padding-bottom: 15px; margin-bottom: 15px;}
  .main_default li a{padding-left: 15px;}
  .help_title{font-size: 18px; margin-bottom: 30px;}
  .main_default_two li{width: 100%;}
  .main_default_two li .q{font-size: 18px; margin-right: 10px;}
  .main_box .single_title{margin-bottom: 30px;}
  .main_box .single_title h1{font-size: 21px; display: inline; margin-bottom: 5px;}
  .main_box .single_title .cat{font-size: 12px;}
  .main_box .single_content h2{font-size: 18px;}
  .main_box .single_content h3{font-size: 16px;}

  /* section */
  .sec_title img{margin-right: 0; max-width: 30px;}
  .sec_title.center span{text-align: center;}

  /* about */
  .wrp_about .grid-2{grid-template-columns: 1fr;}
  .wrp_about ul li a{padding-left: 15px;}

  /* single */
  .main_box .single_ba{flex-wrap: wrap;}
  .main_box .single_ba a{width: 100%; margin-bottom: 20px;}
  .helpful{margin-left: -15px !important; margin-right: -15px !important;}
  .wrp_pagination ul .page-numbers{padding: 10px 12px;}
  .wrp_pagination ul li .prev{margin-right: 15px;}
  .wrp_pagination ul li .next{margin-left: 15px;}

  /*-- top --*/
  /* owner */
  .wrp_first{margin-bottom: 40px;}
  .wrp_first .grid-3{grid-template-columns: 1fr;}


}
  
/*---Sm small---*/
@media only screen and (max-width: 350px) {


}