

body {
  margin: 0;
  padding: 0;
  line-height: 1.5;
  font-size: 1.2vw;
  font-family:"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ","ＭＳ Ｐゴシック",sans-serif;
  overflow-x: hidden;

}

h2{
  font-size: 1.4em;
  font-weight: bold;
  margin-bottom: 0.8em;
}

#org_hr{
  border:none;
  border-top:dashed 1px;
  color: grey;
  width:70%;
  margin-left: 15%;
}
#org_hr2{
  border:none;
  border-top:dashed 1px;
  color: grey;
  width:80%;
  margin-left: 10%;
}

.img_g0 {
text-align: center;
}
.img_g0 img{
width:90%;
max-width: 1000px;
height: auto;
}

.img_g1 {
text-align: center;
}
.img_g1 img{
width:80%;
max-width: 900px;
height: auto;
}

.img_g2 {
text-align: center;
}
.img_g2 img{
width:60%;
max-width: 500px;
height: auto;
}

.img_g3 {
text-align: center;
}
.img_g3 img{
width:70%;
max-width: 900px;
height: auto;
}

.img_g4 {
text-align: center;
}
.img_g4 img{
width:70%;
max-width: 900px;
height: auto;
}

.img_g4_2 {
display: none;
}

.img_g5 {
text-align: center;
}
.img_g5 img{
width:70%;
max-width: 900px;
height: auto;
}
.img_g5_2 {
display: none;
}


.img_g6 {
text-align: center;
}
.img_g6 img{
width:60%;
max-width: 550px;
height: auto;
}

.img_g7 {
text-align: center;
}
.img_g7 img{
width:90%;
max-width: 800px;
margin-left:  auto;
margin-right: auto;
}

.img_g8 {
display: none;
}

#top_header{
display: flex;
justify-content: space-between; /* 左右均等分布 */
/*align-items: center; */
 /* 上下中央揃え */
}
/*
#top_header #company_logo{
line-height: 1em;
}
*/
#top_header_menu{
display: flex;
justify-content: flex-end;

}
#top_header_menu_sp{
display: none;
justify-content: flex-end;
}

#top_header_menu_effects{
display: flex;
justify-content: flex-end;

}

/*
#top_header div{
text-align: center;
margin: 0;
display: flex;
justify-content: flex-end;

}
*/
nav ul{
margin-top: 10px;
margin-right: 10px;
padding: 0;

display: flex;
/*
justify-content: flex-end;
*/
font-size: 1.8vw;
}
nav li{
list-style: none;
display: inline-block;
width: 8em;
font-size: 0.6em;
min-width: 8em;

}
nav li:not(:last-child){
border-right:2px solid #ddd;
}
nav a{
text-decoration: none;
color: gray;
}
nav a:hover{
background-color: white;
color: black;
}

#toha{
  font-size: 2.9em;
  text-align: center;
  font-weight: bold;
  line-height: 1.5em;
}
#toha_blue{
  color: mediumblue;
}

#condense{
text-align: center;
width: 80%;
margin-left: 10%;

display: flex;
justify-content: space-around;
}
#condense_exp{
width: 35%;
}
#condense_img{
width: 50%;
}
#condense_img img{
text-align: center;
width:100%;
max-width: 100%;
height: auto;
}


#page_top{
  width: 90px;
  height: 90px;
  position: fixed;
  right: 0;
  bottom: 0;
  opacity: 0.6;

  z-index: 999;

}
#page_top a{
  position: relative;
  display: block;
  width: 90px;
  height: 90px;
  text-decoration: none;
}
#page_top a::before{
  font-family: FontAwesome;
  content: '\f102';
  font-size: 25px;
  /*
  color: #3f98ef;
  */
  color: blue;

  position: absolute;
  width: 25px;
  height: 25px;
  top: -40px;
  bottom: 0;
  right: 0;
  left: 0;
  margin: auto;
  text-align: center;
}
#page_top a::after{
  content: 'PAGE TOP';
  font-size: 13px;
  color: #fff;
  position: absolute;
  top: 45px;
  bottom: 0;
  right: 0;
  left: 0;
  margin: auto;
  text-align: center;
  /*
  color: #3f98ef;
  */
  color: blue;
}


#company_logo{
/*float:left;*/
display: flex;
}

#company_logo img{
  margin-top: 12px;
  margin-left: 14px;
width: 8em;
}

#company_logo a:hover{
/* リンク部分 */
    display:block;          /* リンク範囲をブロックに変換 */
    background-color: white;
    text-decoration:none;
}


#voice{
  text-align: center;
  width: 68%;
  margin-left: 16%;
  font-size: 1.2em;
  color: black;
}
#voice_title{
  text-align: center;

  font-size: 1.4em;
  color: navy;
}
#section{
  text-align: center;
  width: 68%;
  margin-left: 16%;
  font-size: 1.2em;
  color: black;
}
#section_title{
  text-align: center;

  font-size: 1.4em;
  color: navy;
}


#shop{
  text-align: center;
}

#co-company{
 width: 80%;
 margin-left: 10%;
 height: 100px;

 display: flex;
}
#co-company a{

   display: flex;
   justify-content: space-around;
   align-items: center;
   height: 80%;
}
#co-company a:hover{

    background: white;
}


#co-company-logo{
margin-left: 1%;
display: inline;
}
#co-company-logo a{
/* margin-left: 12%;*/
 display: inline;
}


#co-company-logo a:hover{
/* リンク部分 */
    display:block;          /* リンク範囲をブロックに変換 */
    background-color: white;
    text-decoration:none;
}


#wrapper {
  position: static;
	width: 100%;

	padding: 0;
}


.content {
	position: relative;
	margin: 0 0;
	padding: 0;
/*  width: 98vw;*/
  width: 100%;
  /*
	height: 100vh;*/

}

.img{
 text-align: center;
}

.box_cross {
  width:40%;
  /*
  margin-left: 30%;
  */
  margin-left: auto;
  margin-right: auto;

    position: relative;
    padding: 2em 2em;
}
.box_cross:before,.box_cross:after{
    content:'';
    width: 20px;
    height: 30px;
    position: absolute;
    display: inline-block;
}
.box_cross:before{
    border-left: solid 1px #5767bf;
    border-top: solid 1px #5767bf;
    top:0;
    left: 0;
}
.box_cross:after{
    border-right: solid 1px #5767bf;
    border-bottom: solid 1px #5767bf;
    bottom:0;
    right: 0;
}
.box_cross a:hover{
  background-color: white!important;
}

#movie_title{

}
#movie_ex{
  text-align: center;
  width: 70%;
  margin-left: 15%;
  font-size: 0.6em;
}

#points{
 /* --- BOXの定義 -------------------------------------------------*/
  position      : relative;            /* タイトル用に親要素定義  */
  box-sizing    : border-box;          /* 罫線・余白も含む大きさ  */
  margin        : 8px auto 0 auto;    /* BOXの位置               */
  /*max-width     : 500px;   */            /* BOXの最大横幅           */
  background    : #fff;                /* BOXの背景色             */
  /*padding       : 31px 10px 25px 10px;*/ /* BOX内の余白             */
  /*border        : 4px solid #000000;*/   /* BOXの枠線               */

  margin-left: auto;
  margin-right: auto;
  width:36em;
  padding:2em 1em 2em 1em;
  font-size:1.4em;
  text-decoration:none;
  display:block;
  border-radius:10px;
  border:1px solid #333;
  height: 7em;

}
#points::before {
  /* --- タイトル部分の定義 ----------------------------------------*/
  position      : absolute;          /* 親からの相対位置の定義  */
  display       : inline-block;      /* インラインボックス定義  */
  box-sizing    : border-box;        /* 罫線・余白も含む大きさ  */
  line-height   : 1;                 /* 1行の高さを初期化       */
  background    : #ffffff;           /* タイトル背景色          */
  color         : #000000;           /* タイトルの文字色        */
  content       : attr(title);       /* タイトルに[title]を表示 */
  /*ont-weight   : bold;  */            /* タイトルは太字          */
  /*padding       : 3px 15px; */         /* タイトル内の余白        */
  top           : -12px;             /* タイトル上位置はマイナス*/
  /*left          : 15px;     */         /* タイトル右位置は1文字分 */
  border-radius : 9px;              /* タイトルの角丸          */
  /*font-size     : 15px;  */            /* タイトルの文字サイズ    */

  font-size:1.4em;
  padding       : 0px 1em;          /* タイトル内の余白        */
  left: 2em;
  margin-left: auto;
  margin-right: auto;
}
#points ol li{
  width: 32em!important;
  line-height: 1.5;
  padding-left: 2em;
  list-style-type: none!important;/*ポチ消す*/
}
#points ol li:before{

  font-family: FontAwesome;
  /*
  content: "\f00c";
  */
  content: "\f058";
  position: absolute;
  left : 1em; /*左端からのアイコンまで*/
  color: black; /*アイコン色*/
}

#points2{
 /* --- BOXの定義 -------------------------------------------------*/
  position      : relative;            /* タイトル用に親要素定義  */
  box-sizing    : border-box;          /* 罫線・余白も含む大きさ  */
  margin        : 8px auto 0 auto;    /* BOXの位置               */
  /*max-width     : 500px;   */            /* BOXの最大横幅           */
  background    : #fff;                /* BOXの背景色             */
  /*padding       : 31px 10px 25px 10px;*/ /* BOX内の余白             */
  /*border        : 4px solid #000000;*/   /* BOXの枠線               */

  margin-left: auto;
  margin-right: auto;
  width:36em;
  padding:1em 1em 1em 1em;
  font-size:1.4em;
  text-decoration:none;
  display:block;
  border-radius:10px;
  border:1px solid #333;
  height: 12em;

}
#points2::before {
  /* --- タイトル部分の定義 ----------------------------------------*/
  position      : absolute;          /* 親からの相対位置の定義  */
  display       : inline-block;      /* インラインボックス定義  */
  box-sizing    : border-box;        /* 罫線・余白も含む大きさ  */
  line-height   : 1;                 /* 1行の高さを初期化       */
  background    : #ffffff;           /* タイトル背景色          */
  color         : #000000;           /* タイトルの文字色        */
  content       : attr(title);       /* タイトルに[title]を表示 */
  /*ont-weight   : bold;  */            /* タイトルは太字          */
  padding       : 3px 15px;          /* タイトル内の余白        */
  top           : -12px;             /* タイトル上位置はマイナス*/
  /*left          : 15px;   */           /* タイトル右位置は1文字分 */
  border-radius : 9px;              /* タイトルの角丸          */
  font-size     : 15px;              /* タイトルの文字サイズ    */
  font-size:1.3em;
  left: 2em;
}
#points2 ol{
  padding-left: 1.6em;
}
#points2 ol li{
  width: 32em!important;
/*  padding: 1em 0 1em 0; */
  padding: 1.3em 0 0.5em 0;

}

#tetyou_q{
  color: blue;
  text-align: center;
  font-size: 2em;
  width: 80%;
  margin-left: 10%;
}

.udner_line{
  border-bottom: solid 5px #ffff00;
}

#tetyou_points{
 /* --- BOXの定義 -------------------------------------------------*/
  position      : relative;            /* タイトル用に親要素定義  */
  box-sizing    : border-box;          /* 罫線・余白も含む大きさ  */
  margin        : 8px auto 0 auto;    /* BOXの位置               */
  /*max-width     : 500px;   */            /* BOXの最大横幅           */
  background    : #fff;                /* BOXの背景色             */
  /*padding       : 31px 10px 25px 10px;*/ /* BOX内の余白             */
  /*border        : 4px solid #000000;*/   /* BOXの枠線               */

  margin-left: auto;
  margin-right: auto;
  width:38em;
  padding: 1.5em 1em 0.7em 1em;
  font-size:1.5em;
  text-decoration:none;
  display:block;
  border-radius:20px;
  /*
  border:1px solid #333;
  */
  border:2px solid navy;
  /*
  height: 7em;
  */
}
#tetyou_points::before {
  /* --- タイトル部分の定義 ----------------------------------------*/
  position      : absolute;          /* 親からの相対位置の定義  */
  display       : inline-block;      /* インラインボックス定義  */
  box-sizing    : border-box;        /* 罫線・余白も含む大きさ  */
  line-height   : 1;                 /* 1行の高さを初期化       */
  background    : #ffffff;           /* タイトル背景色          */
  color         : #000000;           /* タイトルの文字色        */
  content       : attr(title);       /* タイトルに[title]を表示 */
  /*ont-weight   : bold;  */            /* タイトルは太字          */
  /*padding       : 3px 15px; */         /* タイトル内の余白        */
  top           : -12px;             /* タイトル上位置はマイナス*/
  /*left          : 15px;     */         /* タイトル右位置は1文字分 */
  border-radius : 9px;              /* タイトルの角丸          */
  /*font-size     : 15px;  */            /* タイトルの文字サイズ    */

  font-size:1.4em;
  padding       : 0px 1em;          /* タイトル内の余白        */
  left: 2em;
  margin-left: auto;
  margin-right: auto;
}
#tetyou_points ul {

 /* 中身の要素の高さに合わせせる方法*/
  height:auto;
	overflow:hidden
 /* ------ */
}

#tetyou_points ul li{
  width: 28em!important;
  padding-left: 1em;
  list-style-type: none!important;/*ポチ消す*/
  text-align: left;

  margin-top: 0.5em;

  margin-bottom: 0.5em;

}
#tetyou_points ul li:before{
  font-size: 0.7em;
  font-family: FontAwesome;
  content: "\f0c8";
  position: absolute;
  left : 1em; /*左端からのアイコンまで*/
  color: black; /*アイコン色*/
}



#compass_points{
 /* --- BOXの定義 -------------------------------------------------*/
  position      : relative;            /* タイトル用に親要素定義  */
  box-sizing    : border-box;          /* 罫線・余白も含む大きさ  */
  margin        : 8px auto 0 auto;    /* BOXの位置               */
  /*max-width     : 500px;   */            /* BOXの最大横幅           */
  background    : #fff;                /* BOXの背景色             */
  /*padding       : 31px 10px 25px 10px;*/ /* BOX内の余白             */
  /*border        : 4px solid #000000;*/   /* BOXの枠線               */

  margin-left: auto;
  margin-right: auto;
  width:38em;
  padding: 1.5em 1em 0.7em 1em;
  font-size:1.5em;
  text-decoration:none;
  display:block;
  border-radius:20px;
  /*
  border:1px solid #333;
  */
  border:2px solid navy;
  /*
  height: 7em;
  */
}
#compass_points::before {
  /* --- タイトル部分の定義 ----------------------------------------*/
  position      : absolute;          /* 親からの相対位置の定義  */
  display       : inline-block;      /* インラインボックス定義  */
  box-sizing    : border-box;        /* 罫線・余白も含む大きさ  */
  line-height   : 1;                 /* 1行の高さを初期化       */
  background    : #ffffff;           /* タイトル背景色          */
  color         : #000000;           /* タイトルの文字色        */
  content       : attr(title);       /* タイトルに[title]を表示 */
  /*ont-weight   : bold;  */            /* タイトルは太字          */
  /*padding       : 3px 15px; */         /* タイトル内の余白        */
  top           : -12px;             /* タイトル上位置はマイナス*/
  /*left          : 15px;     */         /* タイトル右位置は1文字分 */
  border-radius : 9px;              /* タイトルの角丸          */
  /*font-size     : 15px;  */            /* タイトルの文字サイズ    */

  font-size:1.4em;
  padding       : 0px 1em;          /* タイトル内の余白        */
  left: 1em;
  margin-left: auto;
  margin-right: auto;
}
#compass_points ul {

 /* 中身の要素の高さに合わせせる方法*/
  height:auto;
	overflow:hidden
 /* ------ */
}

#compass_points ul li{
  width: 28em!important;
  padding-left: 1em;
  list-style-type: none!important;/*ポチ消す*/
  text-align: left;

  margin-top: 0.5em;
  margin-bottom: 0.2em;

}
#compass_points ul li:before{
  font-size: 0.7em;
  font-family: FontAwesome;
  content: "\f101";
  position: absolute;
  left : 1em; /*左端からのアイコンまで*/
  color: black; /*アイコン色*/
}


#compass_merit{
  width: 48em!important;
  margin-left: auto;
  margin-right: auto;
  font-size: 1.6em;
  color: blue;
}
#compass_merit ul li{
  text-align: center;
  width: 36em!important;
 padding-left: 0em;
 list-style-type: none!important;/*ポチ消す*/
 margin-left: 0!important;
}
#compass_merit ul li:before{
  font-size: 1.1em;
  font-family: FontAwesome;
  content: "\f00c";
  /*
  position: absolute;
  */
  left : 0em; /*左端からのアイコンまで*/
  color: blue; /*アイコン色*/
}


#hcn_points{
 /* --- BOXの定義 -------------------------------------------------*/
  position      : relative;            /* タイトル用に親要素定義  */
  box-sizing    : border-box;          /* 罫線・余白も含む大きさ  */
  margin        : 8px auto 0 auto;    /* BOXの位置               */
  /*max-width     : 500px;   */            /* BOXの最大横幅           */
  background    : #fff;                /* BOXの背景色             */
  /*padding       : 31px 10px 25px 10px;*/ /* BOX内の余白             */
  /*border        : 4px solid #000000;*/   /* BOXの枠線               */

  margin-left: auto;
  margin-right: auto;
  width:50em;
  padding: 1.5em 1em 0.7em 1.6em;
  font-size:1.2em;
  text-decoration:none;
  display:block;
  border-radius:20px;
  /*
  border:1px solid #333;
  */
  border:2px solid navy;
  /*
  height: 7em;
  */
}
#hcn_points::before {
  /* --- タイトル部分の定義 ----------------------------------------*/
  position      : absolute;          /* 親からの相対位置の定義  */
  display       : inline-block;      /* インラインボックス定義  */
  box-sizing    : border-box;        /* 罫線・余白も含む大きさ  */
  line-height   : 1;                 /* 1行の高さを初期化       */
  background    : #ffffff;           /* タイトル背景色          */
  color         : #000000;           /* タイトルの文字色        */
  content       : attr(title);       /* タイトルに[title]を表示 */
  /*ont-weight   : bold;  */            /* タイトルは太字          */
  /*padding       : 3px 15px; */         /* タイトル内の余白        */
  top           : -12px;             /* タイトル上位置はマイナス*/
  /*left          : 15px;     */         /* タイトル右位置は1文字分 */
  border-radius : 9px;              /* タイトルの角丸          */
  /*font-size     : 15px;  */            /* タイトルの文字サイズ    */

  font-size:1.4em;
  padding       : 0px 1em;          /* タイトル内の余白        */
  left: 2em;
  margin-left: auto;
  margin-right: auto;
}
#hcn_points ul {

 /* 中身の要素の高さに合わせせる方法*/
  height:auto;
	overflow:hidden
 /* ------ */
}

#hcn_points ul li{
  width: 38em!important;
  padding-left: 1em;
  list-style-type: none!important;/*ポチ消す*/
  text-align: left;

  margin-top: 0.5em;
  margin-bottom: 0.5em;

}
#hcn_points ul li:before{
  font-size: 0.7em;
  font-family: FontAwesome;
  /*
  content: "\f0c8";
  */
  content: "\f111";
  position: absolute;
  left : 2em; /*左端からのアイコンまで*/
  color: black; /*アイコン色*/
}


#use_points{
 /* --- BOXの定義 -------------------------------------------------*/
  position      : relative;            /* タイトル用に親要素定義  */
  box-sizing    : border-box;          /* 罫線・余白も含む大きさ  */
  margin        : 0px auto 0 auto;    /* BOXの位置               */
  /*max-width     : 500px;   */            /* BOXの最大横幅           */
  /*background    : #fff;     */           /* BOXの背景色             */
  /*padding       : 31px 10px 25px 10px;*/ /* BOX内の余白             */
  /*border        : 4px solid #000000;*/   /* BOXの枠線               */


  background: -moz-linear-gradient(to bottom,white,lightyellow);
  background: -webkit-linear-gradient(to bottom,white,yellow);
  background: linear-gradient(to bottom, white 15%, #fff799 60%, #fff352);

  margin-left: auto;
  margin-right: auto;
  width:56em;
  padding: 1em 1.2em 0.7em 1em;
  font-size: 1.2em;
  text-decoration:none;
  display:block;
  border-radius:20px;
  /*
  border:1px solid #333;
  */
  border: 1px solid dimgrey;
  /*
  height: 7em;
  */
  pointer-events: none;

}
#use_points::before {
  /* --- タイトル部分の定義 ----------------------------------------*/
  position      : absolute;          /* 親からの相対位置の定義  */
  display       : inline-block;      /* インラインボックス定義  */
  box-sizing    : border-box;        /* 罫線・余白も含む大きさ  */
  line-height   : 1;                 /* 1行の高さを初期化       */
  background    : #ffffff;           /* タイトル背景色          */
  color         : blue; //#000000;           /* タイトルの文字色        */
  content       : attr(title);       /* タイトルに[title]を表示 */
  /*ont-weight   : bold;  */            /* タイトルは太字          */
  /*padding       : 3px 15px; */         /* タイトル内の余白        */
  top           : -12px;             /* タイトル上位置はマイナス*/
  /*left          : 15px;     */         /* タイトル右位置は1文字分 */
  border-radius : 9px;              /* タイトルの角丸          */
  /*font-size     : 15px;  */            /* タイトルの文字サイズ    */

  font-size:1.4em;

  padding       : 0px 1em;          /* タイトル内の余白        */
  left: 1em;

  margin-left: auto;
  margin-right: auto;
}
#use_points ul {

 /* 中身の要素の高さに合わせせる方法*/
  height:auto;
	overflow:hidden
 /* ------ */
}

#use_points ul li{
  width: 41em!important;
  padding-left: 3em;
  list-style-type: none!important;/*ポチ消す*/
  text-align: left;
  margin-top: 1em;
  margin-bottom: 0.5em;


}
#use_points ul li:before{
  font-size: 1.4em;
  font-family: FontAwesome;
  /*
  content: "\f0c8";
  */
  content: "\f087";
  position: absolute;
  left : 1.5em; /*左端からのアイコンまで*/
  color: black; /*アイコン色*/
}



.btn_jump {
  /*
  width:40%;
  */
  width:16em;
    font-size:24px;
    font-weight:bold;
    text-decoration:none;
    display:block;
    text-align:center;
    padding:8px 0 10px;
    color: black;
    background-color:white;
    border-radius:10px;
border:1px solid #333;
}
.btn_jump_sim{
  /*
  width:40%;
  */
  width:16em;
    font-size:24px;
    font-weight:bold;
    text-decoration:none;
    display:block;
    text-align:center;
    padding:8px 0 10px;
    color: black;
    background-color:white;
    border-radius:30px;
    /*
border:1px solid #333;
*/
    border:2px solid green;

}

.title1 {
	position: relative;
	margin: 0 3vh 0 0;
	top: 1.4vw;
  padding-left: 6vw;

	color: rgba(255, 255, 255, 1.0);
  font-size: 2.8vw;
  font-weight: bold;
  /*
  font: Lucida Calligraphy;
  */

  text-shadow: 0 0 1.2vw rgba(105, 105, 105, 1.0);

/*
  text-shadow: 0 0 2vw rgba(0, 0, 0, 1.0);
  text-shadow: rgba(155,155,155,0.2) 2px 2px 1vw;
  */
}

.title1 .a{
 color: red;
}


.title2 {
	position: relative;
	margin: 0 4vh 0 0;
	top: 1.1vw;
  padding-left: 6vw;
	color: rgba(255, 255, 255, 1.0);
  font-size: 2.2vw;
  font-weight: bold;

  font: Lucida Calligraphy;

  text-shadow: 0 0 1vw rgba(105, 105, 105, 1.0);

}

.title4{
  font-size: 0.8em;
  padding-top: 1.5em;
 text-align: center;
 /*
padding-left: calc(50% + 45px - 44em);
*/
}
#foot{
  /*
  width: calc(100% - 90px);
  */
  /*
  height: 3em;
  */
  bottom: 0%;
  text-align: center;
background-color: whitesmoke;
}

 #first .inner1 {
  position: absolute;
 	top: 15vw;
 	left: 16vw;
 	width: 20vw;

 	background: rgba(255, 255, 255, 0.7);
 	border: 0.1em solid rgba(150, 150, 150, 0.1);
 	box-shadow: 0 0 0.5vw 0.25vw rgba(0, 0, 0, 0.4);
 	padding: 1vw;
 }

 #first .inner2 {
  bottom: 8vw;
  right: 16vw;
 	width: 20vw;

 	position: absolute;
 	background: rgba(51, 51, 51, 0.7);
 	border: 0.1vw solid rgba(150, 150, 150, 0.1);
 	box-shadow: 0 0 0.5vw 0.25vw rgba(0, 0, 0, 0.4);
 	color: white;
 	padding: 1vw 2vw;
 	text-shadow: 0 -0.1vw 0 rgba(0, 0, 0, 0.5);
 }

#third .inner {
	top: 10vw;
  left: 16vw;
  width: 20vw;

  position: absolute;
	background: rgba(51, 51, 51, 0.7);
	border: 0.1vw solid rgba(150, 150, 150, 0.1);
  box-shadow: 0 0 0.5vw 0.25vw rgba(0, 0, 0, 0.4);
  color: white;
	padding: 1vw 2vw;
	text-shadow: 0 -0.1vw 0 rgba(0, 0, 0, 0.5);
}

/*
#company .inner {
  top: 3vw;
	right: 14vw;
  width: 22vw;

  position: absolute;
	border: 0.1vw solid rgba(150, 150, 150, 0.1);
	box-shadow: 0 0 2vw rgba(0, 0, 0, 0.3);
	color: rgba(105, 105, 105, 1.0);
	padding: 1vw 1vw;
	text-shadow: 0 -0.1vw 0 rgba(0, 0, 0, 0.5);
}

#company .inner2 {
  font-size: 1.0vw;
}
*/

.faq{
  /*
  width: 16em;
  */
  font-size: 1.2em;
  text-align: center;
  display: block;          /* リンク範囲をブロックに変換 */
}
.faq :hover
   {
    color: black;                /* マウスが上に来た時の文字色 */
    background:  white;                   /* 背景色 */
   }

.movie{
  font-size: 1.8em;
  text-align: center;
  display: block;          /* リンク範囲をブロックに変換 */
}
.movie :hover
   {
    color: black;                /* マウスが上に来た時の文字色 */
    background:  white;                   /* 背景色 */
   }



.qr{
  /*
  width: 80%;
  */
  font-size: 1.2em;
/*
display: inline;
*/
display: flex;
      justify-content: center;

align-items:center;

text-align: center;
/*
margin-left: 16%;
margin-right: 10%;
*/
}

.qr a{
 width: 15%!important;
 text-align: center;
}
.qr a:hover{
 background-color: white!important;
}
.qr img{
 width: 40%;
 margin-left: auto;
}

.qr_2{
 display: flex;
 flex-direction: column;
 align-items:center;
}
.qr_2 img{
 width: 20%;
 margin-left: auto;
 margin-right: auto;
}

#company-action{

	width: 77vw;
  height: 30em;
  /*left: 30px;*/
  margin: auto;
  background: #f9f9f9;

 	padding-top: 12%;
  padding-left: 22%;
 }

/* 各項目 */
.listyle{
    padding-left: 0%;
    width:100%;          /* 項目の幅 */

    font-size: 1.3em;
   }


#company-access{
  	width: 100%;
    height: 26em;

 	 padding-top: 12%;
         text-align: center;

          	background: #f9f9f9;

            font-size: 1.3em;
 }


#top{
margin-top: -12em; /* 固定ナビの高さ分のネガティブマージン */
padding-top: 12em; /* 打ち消し用のパディング */
}#action{
margin-top: -12em; /* 固定ナビの高さ分のネガティブマージン */
padding-top: 12em; /* 打ち消し用のパディング */
}
#access{
margin-top: -12em; /* 固定ナビの高さ分のネガティブマージン */
padding-top: 12em; /* 打ち消し用のパディング */
}





/* panel
------------------------------------------------------------------- */

.panel {
  display: block;
  margin-bottom: 20px;
  color: #353539;
  border-bottom: 1px solid #e4e7eb;
  background-color: #fff;
}

.panel > a {
  display: block;
  color: #353539;
}

.panel > a:hover,
.panel > a:visited {
  text-decoration: none;
  color: #353539;
}

.panel > a .thumbnail,
.panel > a .thumbnail-product,
.panel > a .thumbnail-movie {
  overflow: hidden;
  -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0);
}

.panel > a .thumbnail img,
.panel > a .thumbnail-product img,
.panel > a .thumbnail-movie img {
  -webkit-transition: -webkit-transform 400ms linear 0ms;
          transition:         transform 400ms linear 0ms;
}

.panel > a:hover .thumbnail img,
.panel > a:hover .thumbnail-product img,
.panel > a:hover .thumbnail-movie img {
  -webkit-transform: scale(1.08);
      -ms-transform: scale(1.08);
          transform: scale(1.08);
}

.panel:hover,
.panel:visited {
  text-decoration: none;
  color: #353539;
}

a.panel .thumbnail,
a.panel .thumbnail-product,
a.panel .thumbnail-movie {
  overflow: hidden;
}

a.panel .thumbnail img,
a.panel .thumbnail-product img,
a.panel .thumbnail-movie img {
  -webkit-transition: -webkit-transform 400ms linear 0ms;
          transition:         transform 400ms linear 0ms;
}

a.panel:hover .thumbnail img,
a.panel:hover .thumbnail-product img,
a.panel:hover .thumbnail-movie img {
  -webkit-transform: scale(1.08);
      -ms-transform: scale(1.08);
          transform: scale(1.08);
}

.panel-foot {
  padding: 20px;
  border-top: 1px solid #e4e7eb;
  background-color: #fff;
}

.inner-panel {
  padding: 20px 20px 0;
}

.inner-panel .category-list {
  margin-bottom: 15px;
}

.inner-panel .clearfix .category-list {
  float: left;
}

.inner-panel-fzLarge {
  padding: 20px 20px 0;
}

.inner-panel-fzLarge .category-list {
  margin-bottom: 20px;
}

.inner-panel-fzLarge .clearfix .category-list {
  float: left;
}


.box_initial_set {
  width:70%;
  /*
  margin-left:15%;
  */
  margin-left:auto;
  margin-right:auto;

    position: relative;
    /*
    margin: 2em 0;
    */
    padding: 1.5em 2em;
    border: solid 3px navy;//#62c1ce;
}
.box_initial_set .box-title {
    position: absolute;
    display: inline-block;
    top: -27px;
    left: -3px;
    padding: 0 9px;

    height: 25px;

    line-height: 25px;
    /*
    font-size: 17px;
    */
    font-size: 1.3em;
    background: navy; //#62c1ce;
    color: #ffffff;
    font-weight: bold;
    border-radius: 10px 10px 0 0;
}
.box_initial_set p {
    margin: 0;
    padding: 0;
        font-size: 1.2em;

}


/*------------  PC  --------------*/
@media screen and (min-width : 1000px){
  body {
    /*
    font-size: 1.1vw;
    */
    font-size: 14px;
  }
  nav ul{
  font-size: 20px;
  }
}


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

  body {
    font-size: 12px;
  }
  nav ul{
  font-size: 16px;
  }

#top_header_menu{
display: none;
}
#top_header_menu_sp{
display: flex;
}

#wrapper {
  position: static;
	width: 95%;
  /*
	padding: 0;
  */
  margin-left: auto;
  margin-right: auto;
}

.img_g0 img{
text-align: center;
width:120%;
margin-top: 40px;
margin-left: -10%;
/*
max-width: 100%;
*/
height: auto;
}

.img_g1 img{
text-align: center;
width:95%;
margin-left: auto;
margin-right: auto;
/*
max-width: 100%;
*/
height: auto;
}

.img_g2 img{
width:70%;
/*
max-width: 600px;
*/
height: auto;
}

.img_g3 img{
width:95%;
}

.img_g4{
  display: none;
}

.img_g4_2 {
width:80%;
display: block;
margin-left:  auto;
margin-right: auto;
}
.img_g4_2 img{
width:100%;
margin-left:  auto;
margin-right: auto;
}

.img_g5{
  display: none;
}
.img_g5_2 {
width:80%;
display: block;
margin-left:  auto;
margin-right: auto;

}
.img_g5_2 img{
width:100%;
margin-left:  auto;
margin-right: auto;
}

.img_g6 img{
width:90%;
margin-left:  auto;
margin-right: auto;
}

.img_g7 {
display: none;
}
/*
.img_g7 img{
width:90%;
margin-left:  auto;
margin-right: auto;
}
*/
.img_g8 {
display: block;
text-align: center;
}

.img_g8 img{
width:70%;
}

#top_header nav ul{
  flex-wrap: wrap;
  justify-content: space-between;
}
#top_header nav li{
  margin-top: 10px;
}
/*
#top_header_menu{
  flex-wrap: wrap;
  display:flex;
  flex-direction: row;
  justify-content: flex-start;

}
*/
/*
nav ul{
margin-top: 10px;
margin-right: 10px;
padding: 0;

display: flex;
justify-content: flex-end;
font-size: 1.8vw;
}
nav li{
list-style: none;
display: inline-block;
width: 8em;
font-size: 0.6em;
min-width: 8em;

}
*/


#co-company{
      flex-direction:column;
          justify-content: center;
 height: 260px;
}

#co-company a{
  width: 60%;
  margin-left: 20%;
}

#co-company img{
  max-height: 4em;
  max-width: 60%;

margin-bottom: 2em;
/*
   display: flex;
   justify-content: space-around;
   align-items: center;
   height: 80%;
   */
}

#toha{
  font-size: 4.6vw;
}

  #condense{
    flex-direction:column;
    align-items:center;
    margin-left: 0;

    width: 90%;

    justify-content: center;

    margin-left: auto;
    margin-right: auto;

  }
  #condense_exp{
  width: 90%;
  }
  #condense_img {
    width: 100%;
  }
  #condense_img img{
    text-align: center;
    width: 95%;
    height: auto;
  }

  .movie iframe{
   width:95%;
  height:auto;

  }

.qr{
display: flex;
flex-direction: column;
    align-items:center;
}
.qr img{
 width: 90%;
 margin-left: auto;
 margin-right: auto;
}

.qr_2 img{
 width: 70%;
 margin-left: auto;
 margin-right: auto;
}

#topic{
  display: none;
}
.btn_jump {
    font-size:12px;
}

#movie_title{
  width: 86%;
  margin-left: auto;
  margin-right: auto;
}
#movie_ex{
  text-align: center;
  width: 86%;
  margin-left: auto;
  margin-right: auto;
  font-size: 0.7em;
}

#tetyou_q{
  font-size: 1.6em;
  width: 80%;
  margin-left: 10%;
}

#points{
  width: 86%;
  height: 11em;
}
#points::before {
  font-size:1.1em;
  left:1.4em;
}
#points ol li{
  width: 90%!important;
  padding: 0em 0 1.8em 2em;
}

#points2{
  width: 86%;
  /*
  height: 19em;
  */
  height: 18em;
}
#points2::before {
  font-size:1.1em;
  left:1.4em;

}
#points2 ol li{
  width: 100%!important;
  /*
  padding: 0.6em 0 3.8em 0;
  */
    padding:0.7em 0 3.6em 0;

}

#tetyou_points{
  width: 86%;
  font-size:1.1em;
  border:1px solid navy;
}
#tetyou_points::before {
  font-size:1.2em;
  left:1em;
}
#tetyou_points ul li{
  width: 96%!important;
  padding: 0.5em 0 1.2em 1em;
}

#compass_points{
  width: 86%;
  font-size:1.1em;
    border:1px solid navy;
}
#compass_points::before {
  font-size:1.2em;
  left:1em;
}
#compass_points ul li{
  width: 96%!important;
  padding: 0em 0 1.2em 1em;
}

#compass_merit{
  width: 100%!important;
  margin-left: auto;
  margin-right: auto;
  font-size: 1.1em;
  color: blue;
}
#compass_merit ul li{
  width: 100%!important;
  line-height: 1.4em;
}


#hcn_points{
 /* --- BOXの定義 -------------------------------------------------*/
  position      : relative;            /* タイトル用に親要素定義  */
  box-sizing    : border-box;          /* 罫線・余白も含む大きさ  */
  margin        : 8px auto 0 auto;    /* BOXの位置               */
  /*max-width     : 500px;   */            /* BOXの最大横幅           */
  background    : #fff;                /* BOXの背景色             */
  /*padding       : 31px 10px 25px 10px;*/ /* BOX内の余白             */
  /*border        : 4px solid #000000;*/   /* BOXの枠線               */

  margin-left: auto;
  margin-right: auto;
  width:86%;
  padding: 1.5em 1em 0.7em 1em;
  font-size:1.2em;
  text-decoration:none;
  display:block;
  border-radius:20px;
  /*
  border:1px solid #333;
  */
  border:2px solid navy;
  /*
  height: 7em;
  */
}
#hcn_points::before {
  /* --- タイトル部分の定義 ----------------------------------------*/
  font-size:1.4em;
  padding       : 0px 1em;          /* タイトル内の余白        */
  left: 2em;
  margin-left: auto;
  margin-right: auto;
}


#hcn_points ul li{
  /*
  width: 12em!important;
  */
  width: 80%!important;
  padding-left: 1em;
  list-style-type: none!important;/*ポチ消す*/
  text-align: left;

  margin-top: 0.5em;
  margin-bottom: 0.5em;

  padding: 0em 0 1.4em 2em;
}

#hcn_points ul li:before{
  font-size: 0.7em;
  font-family: FontAwesome;
  /*
  content: "\f0c8";
  */
  content: "\f111";
  position: absolute;
  left : 2em; /*左端からのアイコンまで*/
  color: black; /*アイコン色*/
}


#use_points{
  width: 100%;
  font-size:0.8em;
  padding: 1em 0em 0.7em 1em;

  border: 1px solid navy;

}
#use_points::before {

    /* --- タイトル部分の定義 ----------------------------------------*/

    top           : -1em;        /* タイトル上位置はマイナス*/
    font-size:180%;//1.4em;
    padding       : 0px 0em;          /* タイトル内の余白        */
    /*left: 2.8em;*/
    left: 1.4em;
    margin-left: auto;
    margin-right: auto;

    color: blue;
    padding-top: 0.5em;

}

#use_points ul {
  margin-bottom: 2em;
}
#use_points ul li{
  width: 84%!important;
  padding: 0.5em 3em 1.2em 2.2em;
  font-size: 150%;
  line-height: 1.2em;
}
#use_points ul li:before{
  left : 0.8em; /*左端からのアイコンまで*/
}

#section{
  width: 88%;
  margin-left: 6%;
  font-size: 1.1em;
}
#section_title{
  font-size: 1.4em;
}

.btn_jump_sim{

  width:70%;
  font-size:1.2em;

    font-weight:bold;
    text-decoration:none;
    display:block;
    text-align:center;
    padding:8px 0 10px;
    color: black;
    background-color:white;
    border-radius:30px;
    /*
border:1px solid #333;
*/
    border:2px solid green;

}
.box_cross {

  width:70%;
  /*
  margin-left:  15%;
  */

    position: relative;
    padding: 2em 2em;
}
.box_cross:before{
    border-left: solid 0px white;
    border-top: solid 0px white;
}
.box_cross:after{
    border-right: solid 0px white;
    border-bottom: solid 0px white;
}

.box_initial_set {
  width:82%;
  /*
  margin-left:6%;
  */

}
.box_initial_set .box-title {
    top: -27px;
    left: -3px;
    padding: 0 9px;

    height: 25px;

    line-height: 25px;
    /*
    font-size: 1em;
    */
  font-size: 14px;
}

.box_initial_set {

    padding: 0.5em 1em;
}
.box_initial_set p {
  font-size: 14px;
}

}

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

  #points{
    height: 12em;
  }
  #points::before {
    font-size: 1em;
    left:1em;
  }
  #points ol li{
    font-size: 0.9em;
    padding: 0.2em 1em 3em 2em;
  }

  #points2{
    /*
    height: 19em;
    */
    height: 17em;
  }
  #points2::before {
    font-size: 0.9em;
    left:1em;
  }
  #points2 ol li{
    font-size: 0.9em;
    /*
    padding: 0.6em 0 4em 0;
    */
    padding: 0.8em 0 4em 0;
  }

  #section{
    font-size: 1.1em;
  }

  #tetyou_points::before{
    font-size: 1.1em;
      left: 0.7em;
  }
  #tetyou_points ul li{
    width: 90%!important;
    padding: 1.4em 0 1.8em 1em;
    line-height: 1.1em
  }

  #compass_points ul li{
    font-size: 1em;
    width: 96%!important;
    padding: 0.9em 0 0.9em 1em;
  }

  #compass_merit  ul li{
    line-height: 1.2em;
    padding-top: 1em;
  }

  #hcn_points::before {
    /* --- タイトル部分の定義 ----------------------------------------*/
    left: 0.7em;
  }

  #hcn_points ul li{
    width: 86%!important;
    padding-left: 1em;

    padding: 0em 0 2.4em 2em;
  }

#use_points ul li:before{
  left : 0.8em; /*左端からのアイコンまで*/
}



  .box_cross:before{
      border-left: solid 0px white;
      border-top: solid 0px white;
  }
  .box_cross:after{
      border-right: solid 0px white;
      border-bottom: solid 0px white;
  }

  .box_initial_set .box-title {

      font-size: 13px;

  }

}
