/*説明文のテキストデザインを変える*/
@media screen and (min-width: 1007px) {

li {
  list-style: none;
}

.header {
  background-color: #000000;
  color: #ffffff;
  height: 44px;
 margin-bottom: -7px;
}

.header-logo {
  float: left;
  font-size: 17px;
  padding: 9px 100px 20px 20px;
  font-family: "ＭＳ 明朝",serif;
  color: #ffffff;
}

.header-list {
  float: left;
  padding-left:136px;
}

.header-list li {
  float: left;
  font-size:17px;
  padding-right: 55px;
  font-family: "ＭＳ 明朝",serif;
  margin-top: -8px;
}

.header-logo-li1{
  color: #ffffff;
}

/*タイトル　Shoulder check*/
/*背景のlocal表示はshoulders.jpgのみ*/
.haike3{
  background-image: url(http://katatest.moo.jp/katano-katari/css/shoulders.jpg);
  background-size: cover;
  height: 0px;
  object-fit: cover;
  position: relative;
  width: 100%;
  padding-top: 58%;
  background-repeat: no-repeat;
  background-position: center center;
}



.tit{
  font-size: 13px;
}

.tit h1{
  text-align: center;
font-size: 2.8vw;
font-family: "ＭＳ 明朝",serif;
position: absolute;
top: 12%;
left: 38%;
margin: 0;
}

/*タイトル　Shoulder check デザイン*/
.S{
  color:#AA0000;
}
.C{
  color:#AA0000;
}

/*タイトル　自分の肩の状態をチェックしよう*/

.tit h2{
  font-size: 1.2vw;
      font-family: "ＭＳ 明朝",serif;
      position: absolute;
      top: 23%;
      left: 41%;
      margin: 0;
}

/*タイトル　自分の肩の状態をチェックしよう デザイン*/



.tit p{
  position: absolute;
    top: 4%;
    left: 86%;
    margin: 0;
    font-size: 0.6vw;
}
.my-skyblue{
  color: #0000FF;
}
.my-youtube{
  color:#FF0000;
}
.my-twitter{
  color:#99CCFF;
}
.my-blog{
color:#66CC00;
}

.yahoo_sarch{
  position: absolute;
     top: 10%;
     left: 80%;
}



/*menuボタン*/

.check_menu{
  position: absolute;
  width: 250px;
  left: 11%;
  top: 43%;
}

.check_menu ul {
	width: 230px;
	margin: 0;
	padding: 0;
	list-style-type: none;
	background-color: #eeeeee;
}
.check_menu li a {
	display: block;
	padding: 8px 16px;
	text-decoration: none;
	color: #000000;

}
.check_menu li {
	text-align: center;
}
.check_menu li:last-child {
	border-bottom: none;
}
.active {
	color:#FFFFFF;
	background-color: #da3c41;
}
.check_menu li a:hover:not(.active) {
	color: #ffffff;
	background-color: #1b2538;
}

.contents_a{
    font-size:10px;
    padding:0px;
    margin-top:0px;
    	text-align:left;
}

.contents_b{
    font-size:10px;
    padding:0px;
    margin-top:0px;
    text-align:center;
}

.kozintekiburogu_setumei{
  position: absolute;
    top: 92%;
    right: 2%;
  font-size: 1.1vw;
}


.riyoukiyaku_iti{
  top: 49vw;
    left: 64vw;
    width: 51vw;
    position: absolute;
    text-decoration: none;
    color: black;
    font-size: 1.2vw;
}

/*隠しボタン*/
.miyaza{
  position: absolute;
  top:800px;
  left:8px;
  width:5px;
}

.miyaza1{
  position: absolute;
  top:100px;
  left:8px;
  width:5px;
}




/*shoulder check 開始ボタン*/

/*shoulder check 開始ボタン 位置の変更*/
.nitak-gazou1{
  position: absolute;
    width: 250px;
    left: 44%;
    top: 47%;
}

.nitak-gazou1 h1{
font-family: "ＭＳ 明朝",serif;
font-size:20px;
 position: absolute;
 left:31px;
    top:130px;
    color:#FF5722;
}


a.btn_start {
	display: block;
	text-align: center;
	text-decoration: none;
	color: #FF5722;
	width: 120px;
	height: 120px;
	line-height: 120px;
	border: double 4px #FF5722;
	border-radius: 50%;
	vertical-align: middle;
	overflow: hidden;
	transition: .6s;
	background: white;
}
a.btn_start:hover {
	transform: rotateY(360deg);
	background: #EC407A;
	color:white;
	border: double 4px white;
}











/*アンケート選択*/

/*意味ないかも*/
Question:not(:first-of-type) {
  display: none;
}





#q1, #q2, #q3, #q4, #q5, #q6, #q7, #q8, #q9, #q10, #q11, #q12, #q13, #q14, #q15, #q16, #q20, #q21, #q22, #q17, #q18{
  width: 500px;
    top: -500px;
    margin: 0 auto;
    left: -30px;
    position: relative;
}


 #Ans1, #Ans2, #Ans3, #Ans4, #Ans5, #Ans6{
   width: 500px;
     top: -701px;
     margin: 0 auto;
     left: -241px;
     position: relative;
 }


.imag1{
  position: absolute;
  height:300px;
  top:0;
  left:0;
  margin: 0
}

.imag2{
  position: absolute;
height:150px;
top:131px;
left:370px;
}

.imag3{
    position: absolute;
    height:150px;
    top:131px;
    left:370px;
}

.imag4{
    position: absolute;
    height:200px;
    top: 83px;
    left: 418px;
}

.imag5{
    position: absolute;
    height:200px;
    top: 87px;
    left: 440px;
}


.QUE{
  font-family: "ＭＳ 明朝",serif;
  font-size: 30px;
  color:#FF9966;
  position: absolute;
  top: 0;
  left:41px;
}

.koumoku{
  position: absolute;
font-family: "ＭＳ 明朝",serif;
font-size: 20px;
top:59px;
left:41px;
}

.yes{
  position: absolute;
 left:41px;
 top:150px;
 height:130px;
}

.no{
  position: absolute;
  left:205px;
  top:150px;
  height:130px;
}



.uemuki7{
  position: absolute;
  right:550px;
  top:420px;
}

.yokomuki-sita7{
  position: absolute;
  right:540px;
  top:470px;
}

.yikomuki-ue7{
  position: absolute;
  right:540px;
  top:530px;
}


/*アンケート結果*/
.answer1{
  top: 10%;
     padding-top: -18px;
     padding-left: 350px;
     position: absolute;
     left: -8px;
     right: 0px;
}

.ansimag2{
    position: absolute;
    height:280px;
    top:210px;
    left:370px;

}

.anskekka{
  font-family: "ＭＳ 明朝",serif;
  font-size: 30px;
  color:#FF9966;
  position: absolute;
  top:226px;
  left:430px;
}

.kekkasetumei{
     position: absolute;
     font-family: "ＭＳ 明朝",serif;
     font-size: 15px;
     top:300px;
     left:430px;
     width: 555px;
}

.syuusin{
  position: absolute;
  left: 500px;
    top: 421px;
}

.nitizyouseikatu{
  position: absolute;
  left: 727px;
    top: 421px;
  cursor:pointer;
}

.undou_strech{
   position: absolute;
  left: 574px;
  top:427px;
}


.selfexecise{
  position: absolute;
    top: 88px;
    left: 6%;
    width: 347px;
    font-family: "ＭＳ 明朝",serif;
}

.selfexecise h1{
  font-size: 43px;
}

.syuusin7{
  position: absolute;
top: 150px;
left: 50%;
width: 7%;
}
.nitizyouseikatu7{
  position: absolute;
  top: 150px;
  left: 61%;
  width: 9%;
}




.mainImage img{
  text-align: center;
width: 94%;
position: absolute;
top: 17px;
left: 20px;
}



.mainImage{
  position: relative;
  top: 169px;
 left: -450px;
      background-color: rgba(192, 192, 192, 0.2);
      width: 49%;
      height: 0;
      padding-top: 37%;
      display: inline-block;
}

.thumbnails{
  background-color: rgba(192, 192, 192, 0.1);
    top: 472px;
    position: absolute;
    left: 54%;
    height: 0px;
    width: 0px;
    width: -1%;
    padding-top: 28%;
    padding-left: 42%;
    margin-top: -135px;
}



.thumbnails_1{
  width: 37%;
    position: absolute;
    top: 21px;
    left: 6%;
}


.thumbnails_2{
  width: 37%;
    position: absolute;
    top: 21px;
    left: 55%;
}

.thumbnails_3{
  width: 37%;
      position: absolute;
      top: 52%;
      left: 6%;
}


.thumbnails_4{
  width: 37%;
      position: absolute;
      left: 55%;
      top: 52%;
}

.thumbnails img {
    cursor:pointer;
}

.change_exercisemore{
  width: 3%;
    position: absolute;
    left: 97%;
    top: 0%;
}
.change_exercise1{
  width: 2%;
    position: absolute;
    left: 41%;
    top: 44%;
}
.change_exercise2{
  width: 2%;
    position: absolute;
    left: 90%;
    top: 44%;
}
.change_exercise3{
  width: 2%;
position: absolute;
left: 41%;
top: 91%;
}
.change_exercise4{
  width: 2%;
    position: absolute;
    left: 90%;
    top: 91%;
}

.change_exercise_index3_image_change_img{
  width:40%;
}
.index3_image_change{
  position: absolute;
    left: 1%;
    top: 99%;
}



.ankeit_index3_zisyutore {
  position: absolute;
      top: 83px;
      left: 4%;
}


.tit2 p{
  position: absolute;
    top: 90px;
    left: 80%;
}

.tit2_zisyutore{
  margin: 0;
      font-size: 1.2vw;
      position: absolute;
      top: 94px;
      left: 79%;
}

.yahoo_sarch8{
  position: absolute;
      top: 168px;
      left: 77%;
}

.self_kotoba{
  position: absolute;
     top: 220px;
     left: 53%;
     width: 41%;
     font-family: "ＭＳ 明朝",serif;
     background-color: rgba(255, 204, 204, 0.1);
}


#qq1{
  cursor: pointer;
    width: 500px;
    margin: 0 auto;
    position: relative;
    top: -78px;
    left: 300px;
}


.warmingup{
  position: absolute;
    top: 196px;
    left: 52px;
    cursor: pointer;
    width: 9%;
}

.index3_selfex_insatu{
  position: absolute;
    top: 130px;
    left: 36%;
    cursor: pointer;
    border-radius: 10px;
    background-color: #66CC00;
    font-size: 1.0vw;
    padding: 6px;
    margin: 0;
    color: white;
}
.index3_selfex_pdf{
  display: none;
}


.index3_undouwodougademiru{
      margin-left: 33%;
}

.youtube{
  color:#FF0000;
}

.undoudouga{
  font-size: 23px;
    cursor: pointer;
    color: black;
    font-family: "ＭＳ 明朝",serif;
}

a.ankeit{
    animation: flashing 1.0s ease-out;
    animation-iteration-count: infinite;    /* 繰り返し回数 または infinite */
    color: #993333;
    position:absolute;
    top: 75px;
    left: 3%;
    font-family: "ＭＳ 明朝",serif;
}

@keyframes flashing {
    0%   { opacity: 0.5; }
    50%  { opacity: 1;}
    100% { opacity: 0.5; }
}






/*日常生活の工夫*/
.yahoo_sarch3 {
  position: absolute;
  top: 170px;
  left: 76%;
}

.in5titole{
  position: absolute;
    top: 83px;
    left: 5%;
    font-size: 45px;
    font-family: "ＭＳ 明朝",serif;
}
.in5hukutitole{
  position: absolute;
    top: 179px;
    left: 4%;
    font-size: 25px;
    font-family: "ＭＳ 明朝",serif;
}

a.ankeit10 {
  animation: flashing 1.0s ease-out;
  animation-iteration-count: infinite;
  color: #993333;
  position: absolute;
  top: 74px;
  left: 23px;
  font-family: "ＭＳ 明朝",serif;
}

.nitizyo{
  color:red;
}


.hutanno{
  color:blue;
}
.tit3 p{
  position: absolute;
    top: 100px;
    left: 80%;
}
.in5fa{
  color: #0000FF;
}
.in5line{
  color:#00FF00;
}
.in5twi{
  color:#99CCFF;
}
.in5kensaku{
 position: absolute;
 top:150px;
 right:80px;
 font-size:40px;
}

.index5_nitizyouseikatu_matome{
  top: 382px;
    position: absolute;
    left: 44%;
    height: 0px;
    width: 0px;
    padding-top: 28%;
    padding-left: 47%;
    margin-top: -196px;
}


.index5_nitizyouseikatu_1{
  position: absolute;
    width: 30%;
    top: 48px;
    left: 4%;
}

.index5_nitizyouseikatu_2{
  position: absolute;
    width: 30%;
    top: 48px;
    left: 37%;
}

.index5_nitizyouseikatu_3{
  position: absolute;
      width: 30%;
      top: 48px;
      left: 69%;
}


.imadekiruex{
  position: absolute;
      top: 150px;
      left: 63%;
      width: 10%;
}



.syuusin6{
  position: absolute;
top: 151px;
left: 52%;
width: 8%;
}

.mainImage2 img{
 text-align:center;
  width:800px;
  position:absolute;
 top:130px;
 left:300px;
}
.thumbnails2{
 width:50%;
 margin:0 auto;
 position:absolute;
 top:200px;
 right:-400px;
}
.thumbnails2 img{
 width:30%;
}



.cp_qa{
  position: absolute;
  top: 300px;
  left: 5%;
  width: 123%;
}

.cp_qa *, .cp_qa *:after, .cp_qa *:before {
	-webkit-box-sizing: border-box;
	        box-sizing: border-box;
}


.cp_qa .cp_actab {
	position: relative;
	overflow: hidden;
	width: 30%;
	margin: 0 0 1em 0;
	color: #1b2538;
}
.cp_qa .cp_actab input {
	position: absolute;
	opacity: 0;
}
/* 質問 */
.cp_qa .cp_actab label {
	font-weight: bold;
	line-height: 1.6em;
	position: relative;
	display: block;
	margin: 0 0 0 0;
	padding: 1em 2em 1em 2.5em;
	cursor: pointer;
	text-indent: 1em;
	border-radius: 0.5em;
	background: rgba(27,37,56,0.1);
}
.cp_qa .cp_actab label::before {
	font-family: serif;
	font-size: 1.5em;
	margin-left: -2em;
	padding-right: 0.5em;
	content: 'Q';
}
.cp_qa .cp_actab label:hover {
	transition: all 0.3s;
	color: #00838f;
}
/* --質問の＋アイコン */
.cp_qa .cp_actab label::after {
	font-size: 1.7em;
	font-weight: bold;
	line-height: 2em;
	position: absolute;
	top: 0;
	right: 0;
	content: '+';
	display: inline-block;
	width: 2em;
	height: 2em;
	-webkit-transition: transform 0.4s;
	        transition: transform 0.4s;
}
/* 答え */
.cp_qa .cp_actab .cp_actab-content {
	position: relative;
	overflow: hidden;
	max-height: 0;
	padding: 0 0 0 2.5em;
	-webkit-transition: max-height 0.2s;
	        transition: max-height 0.2s;
	border-radius: 0 0 0.5em 0.5em;
}
.cp_qa .cp_actab .cp_actab-content::before {
	font-family: serif;
	font-size: 1.5em;
	position: absolute;
	margin: 0.4em 0 0 -1em;
	padding: 0;
	content: 'A';
}
.cp_qa .cp_actab .cp_actab-content p {
	margin: 1em 1em 1em 0;
}
/* 質問を開いた時の仕様 */
/* --答えの高さ */
.cp_qa .cp_actab input:checked ~ .cp_actab-content {
	max-height: 40em;
	border: 10px solid rgba(27,37,56,0.1);
}
/* 質問をクリックした時のアイコンの動き */
.cp_qa .cp_actab input:checked ~ label {
	color: #00838f;
	border-radius: 0.5em 0.5em 0 0;
}
/* 質問をクリックした時の+の動き */
.cp_qa .cp_actab input[type=checkbox]:checked + label::after {
	-webkit-transform: rotateZ(45deg);
	transform: rotateZ(45deg);
	-webkit-transform-origin: 50% 50%;
	transform-origin: 50% 50%;
}


/*チェックポイント*/
.cp_point {
  position: relative;
margin: 42% 0 30px;
padding: 25px 20px 15px 40px;
border: 3px double #da3c41;
background-color: #fffafa;
border-radius: 10px;
width: 50%;
float: right;
}
.cp_point::before {
	position: absolute;
	top: -1.25em;
	left: 1.5em;
	content: attr(title);
	padding: .3em .5em 0 2em;
	font-size: 90%;
	font-weight: bold;
	color: #da3c41;
	height: 27px;
	background-color: #fcfcfc;
	border-radius: 20px;
	border: 2px solid #da3c41;
}
.cp_point::after {
	position: absolute;
	top: -1em;
	left: .5em;
	font-family: FontAwesome;
	content: "\f164 ";
	padding: .3em 0 0 0;
	font-size: 18px;
	color: #fff;
	line-height: 25px;
	text-align: center;
	width: 35px;
	height: 30px;
	background-color: #da3c41;
	border-radius: 20px 0 0 20px;
}
.cp_point li {
	position: relative;
	list-style-type: none;
}
.cp_point li::before {
	position: absolute;
	top: .25em;
	left: -1.5em;
	font-family: FontAwesome;
	content: "\f138 ";
	color: #bbb;
}
.checkpoint{

}









/*就寝ページ*/

.bagusyuusei{
  color:black;
  font-size:0px;
}


.index6_top{
  height:750px;

}
.syu{
  color:red;
}
.in6titole{
  position: absolute;
    top: 90px;
    left: 10%;
    font-size: 36px;
    font-family: "ＭＳ 明朝",serif;
}
.in6hukutitole{
  position: absolute;
    top: 171px;
    left: 9%;
    font-size: 19px;
    font-family: "ＭＳ 明朝",serif;
}
.yakantuu{
  color:blue;
}
.index6_top p{
  position: absolute;
    top: 90px;
    left: 81%;
    font-size: 11px;
}
.in6fa{
  color: #0000FF;
}
.in6line{
  color:#00FF00;
}
.in6twi{
  color:#99CCFF;
}
.yahoo_sarch6 {
  position: absolute;
    top: 0px;
    left: 69%;
}


.syuusinsyasin_matome{
  top: 355px;
position: absolute;
left: 48%;
height: 0px;
width: 0px;
padding-top: 28%;
padding-left: 42%;
margin-top: -196px;
}

.syuusinsyasin1{
  width: 45%;
      position: absolute;
      top: 21px;
      left: 6%;
}

.syuusinsyasin2{
  width: 45%;
      position: absolute;
      top: 21px;
      left: 55%
}

.syuusinsyasin3{
  width: 45%;
  position: absolute;
  top: 56%;
  left: 6%;
}

.syuusinsyasin4{
  width: 45%;
      position: absolute;
      left: 55%;
      top: 56%;
}

a.ankeit9 {
  animation: flashing 1.0s ease-out;
  animation-iteration-count: infinite;
  color: #993333;
  position: absolute;
  top: 74px;
  left: 23px;
  font-family: "ＭＳ 明朝",serif;
}



.nitizyouseikatu6{
  position: absolute;
top: 100px;
left: 58%;
width: 8%;
}

/* 質問 */



#QandA-2 {
	width: 37%;
	font-family: メイリオ;
	font-size: 12px; /*全体のフォントサイズ*/
  position:absolute;
  top:237px;
  left:100px;
}
#QandA-2 h3 {
	font-size: 16px;
	margin-top: 32px;
}
#QandA-2 dl {
	border: 1px solid #ccc;
}
#QandA-2 dt {
font-weight: bold;
	color: #111;
	background: #f4f4f4; /* 「Q」タイトルの背景色 */
	padding: 8px;
	border-top: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
}
#QandA-2 dt:first-child {
	border-top: none;
}
#QandA-2 dt:before {
	content: "Q.";
	font-weight: bold;
	margin-right: 8px;
}
#QandA-2 dd {
	padding: 16px 16px 24px 30px;
	margin: 0;
	line-height: 140%;
}
#QandA-2 dd:first-line {
	font-weight: bold;
	color: #bf0000;
}
#QandA-2 dd:before {
	content: "A.";
	font-weight: bold;
	margin-right: 8px;
	margin-left: -21px;
}

/*チェックポイント*/
.cp_point6 {
  position: relative;
    margin: 41% 4% 30px;
    padding: 25px 20px 15px 40px;
    border: 3px double #da3c41;
    background-color: #fffafa;
    border-radius: 10px;
    width: 41%;
    float: right;
}
.cp_point6::before {
	position: absolute;
	top: -1.25em;
	left: 1.5em;
	content: attr(title);
	padding: .3em .5em 0 2em;
	font-size: 90%;
	font-weight: bold;
	color: #da3c41;
	height: 27px;
	background-color: #fcfcfc;
	border-radius: 20px;
	border: 2px solid #da3c41;
}
.cp_point6::after {
	position: absolute;
	top: -1em;
	left: .5em;
	font-family: FontAwesome;
	content: "\f164 ";
	padding: .3em 0 0 0;
	font-size: 18px;
	color: #fff;
	line-height: 25px;
	text-align: center;
	width: 35px;
	height: 30px;
	background-color: #da3c41;
	border-radius: 20px 0 0 20px;
}
.cp_point6 li {
	position: relative;
	list-style-type: none;
}








}






















































@media screen and (max-width: 1007px) {
  li {
    list-style: none;
  }

  .header {
    background-color: #000000;
    color: #ffffff;
    height: 34px;
   margin-bottom:-50px;
  }

  .header-logo {
    float: left;
    font-size: 15px;
    padding: 7px 100px 20px 20px;
    font-family: "ＭＳ 明朝",serif;
    color: #ffffff;
  }

  .header-list {
    float: left;
    padding-left:200px;
    display: none;
  }

  .header-list li {
    float: left;
    font-size:20px;
    padding-right: 200px;
    font-family: "ＭＳ 明朝",serif;
  }

  .header-logo-li1{
    color: #ffffff;
  }

  /*タイトル　Shoulder check*/

  .haike3{
    background-image: url(http://katatest.moo.jp/katano-katari/css/shoulders.jpg);
   background-size: cover;
   height: 0px;
   object-fit: cover;
   position: relative;
   width: 100%;
   padding-top: 178%;
   background-repeat: no-repeat;
   background-position: center center;
   margin-top: 50px;
  }



  .tit{


  }

  .tit h1{
    font-size: 5vw;
    font-family: "ＭＳ 明朝",serif;
    margin: 0;
    position: absolute;
    top: 10%;
    left: 31%;
  }

  /*タイトル　Shoulder check デザイン*/
  .S{
    color:#AA0000;
  }
  .C{
    color:#AA0000;
  }

  /*タイトル　自分の肩の状態をチェックしよう*/

  .tit h2{
    font-family: "ＭＳ 明朝",serif;
    margin: 0;
    position: absolute;
    top: 18%;
    left: 29%;
    right: 0;
    padding: 0;
  font-size: 3vw;
  }

  /*タイトル　自分の肩の状態をチェックしよう デザイン*/



  .tit p{
    font-size: 1.5vw;
      margin: 0;
      position: absolute;
      top: 3%;
      left: 71%;
  }
  .my-skyblue{
    color: #0000FF;
  }
  .my-youtube{
    color:#FF0000;
  }
  .my-twitter{
    color:#99CCFF;
  }

  .yahoo_sarch{
   position: absolute;
   top:160px;
   right:70px;
   display: none;
  }

  /*menuボタン*/

  .check_menu{
    top: 66%;
    left: 31%;
    position: absolute;
    width: 50%;
  }

  .check_menu ul {
    width: 36vw;
    margin: 0;
    padding: 0;
    list-style-type: none;
    background-color: #eeeeee;
  }
  .check_menu li a {
    display: block;
      padding: 8px 16px;
      text-decoration: none;
      color: #000000;
      font-size: 3.5vw;

  }
  .check_menu li {
    text-align: center;
  }
  .check_menu li:last-child {
    border-bottom: none;
  }
  .active {
    color:#FFFFFF;
    background-color: #da3c41;
  }
  .check_menu li a:hover:not(.active) {
    color: #ffffff;
    background-color: #1b2538;
  }

  .contents_a{
      font-size:10px;
      padding:0px;
      margin-top:0px;
        text-align:left;
  }

  .contents_b{
      font-size:10px;
      padding:0px;
      margin-top:0px;
      text-align:center;
  }

  .kozintekiburogu_setumei{
    font-size: 2.7vw;
    width: 100%;
    background-color: #EEEEEE;
    margin-top: 4vw;
  }


  .riyoukiyaku_iti{
    text-align: center;
    margin-top: 6vw;
    position: absolute;
    text-decoration: none;
    top: 6vw;
    left: 56vw;
    font-size: 1.7vw;
  }





  /*shoulder check 開始ボタン*/

  /*shoulder check 開始ボタン 位置の変更*/
  .nitak-gazou1{
    width: 28%;
    top: 34%;
    margin: 0 auto;
    left: 0%;
    right: 0%;
    position: absolute;

  }

  .nitak-gazou1 h1{
    left: 23%;
      font-family: "ＭＳ 明朝",serif;
      font-size: 4vw;
      color: #FF5722;
      margin: 0;
      position: absolute;
      top: 111%;
  }


  a.btn_start {
    display: block;
    text-align: center;
    text-decoration: none;
    color: #FF5722;
    width: 24vw;
    height: 24vw;
    line-height: 24vw;
    border: double 4px #FF5722;
    border-radius: 50%;
    vertical-align: middle;
    overflow: hidden;
    transition: .6s;
    background: white;
    font-size: 4vw;
  }
  a.btn_start:hover {
    transform: rotateY(360deg);
    background: #EC407A;
    color:white;
    border: double 4px white;
  }


  /*　基本情報*/
  .kihonzyouhou2{
    background-color: #FFFFCC;
    width:360px;
    padding: 10px;
    position: absolute;
    top:200px;
    left:400px;
  }


  /*アンケート選択*/

  /*意味ないかも*/
  .Question:not(:first-of-type) {
    display: none;
  }



  #q1, #q2, #q3, #q4, #q5, #q6, #q7, #q8, #q9, #q10, #q11, #q12, #q13, #q14, #q15, #q16, #q20, #q21, #q22, #q17, #q18{
    width: 100%;
      top: -123vw;
      margin: 0 auto;
      left: 0;
      position: relative;
      height: 0;
      padding-top: 61%;
  }


   #Ans1, #Ans2, #Ans3, #Ans4, #Ans5, #Ans6{
     width: 100%;
    top: -119vw;
    margin: 0 auto;
    left: 0;
    position: relative;
    height: 0;
    padding-top: 61%;
   }

  .imag1{
    position: absolute;
    height: auto;
    top: 0;
    left: 0px;
    width: 100%;
  }

  .imag2{
    position: absolute;
    height: 49%;
    top: 37%;
    left: 61%;
  }

  .imag3{
    position: absolute;
    height: 50%;
    top: 31%;
    left: 64%;
  }

  .imag4{
    position: absolute;
    height: 54%;
    top: 24%;
    left: 76%;
  }

  .imag5{
    position: absolute;
  height: 54%;
  top: 28%;
  left: 79%;

  }


  .QUE{
    font-family: "ＭＳ 明朝",serif;
    font-size: 6vw;
    color: #FF9966;
    position: absolute;
    top: -5%;
    left: 3%;
  }

  .koumoku{
    font-family: "ＭＳ 明朝",serif;
    font-size: 4vw;
    position: absolute;
    top: 15%;
    left: 3%;
  }

  .yes{
    height: 33%;
    position: absolute;
    top: 44%;
    left: 8%;
  }

  .no{
    height: 33%;
      position: absolute;
      top: 44%;
      left: 34%;
  }



  .uemuki7{
    position: absolute;
    right:550px;
    top:420px;
  }

  .yokomuki-sita7{
    position: absolute;
    right:540px;
    top:470px;
  }

  .yikomuki-ue7{
    position: absolute;
    right:540px;
    top:530px;
  }


  /*アンケート結果*/
  .answer1{
    width: 313px;
     top: -96px;
     margin: 0 auto;
     left: -377px;
  }

  .ansimag2{
    position: absolute;
    height: 60vw;
    top: 0;
    left: 0px;
    width: 100%;
  }

  .anskekka{
    font-family: "ＭＳ 明朝",serif;
    font-size: 6vw;
    color: #FF9966;
    position: absolute;
    top: 2%;
    left: 7%;
  }

  .kekkasetumei{
    font-family: "ＭＳ 明朝",serif;
    font-size: 3vw;
    width: 90%;
    position: absolute;
    top: 33%;
    left: 7%;
    margin: 0;
  }

  .syuusin{
    cursor: pointer;
    height: 10%;
    position: absolute;
    top: 74%;
    left: 14%;
  }

  .nitizyouseikatu{
    cursor: pointer;
    height: 10%;
    position: absolute;
    top: 74%;
    left: 49%;
  }

  .undou_strech{
    cursor: pointer;
    height: 10%;
    position: absolute;
    top: 78%;
    left: 29%;
  }


  .selfexecise{
    margin-top: 10px;
    text-align: center;
  }

  .selfexecise h1{
    font-size: 7vw;
      margin: 0;
  }
  .index3_syusinto_nitizyouseikatu_matome{
    text-align: center;
        margin-top: 27px;
  }

  .syuusin7{
    width: 90px;
  }
  .nitizyouseikatu7{
    width: 109px;
  }



  .haikei4{
  background-image: url(/Dull.jpg);
  background-size: cover;
  height: 0px;
  object-fit: cover;
  position: relative;
  width: 100%;
  padding-top: 209%;
  background-repeat: no-repeat;
  background-position: center center;
  margin-top: 50px;
  }

  .index4_haikeinaka{
  position: absolute;
  top:0%;
  left:0%;
  }


  .mainImage img{
    text-align: center;
     width: 100%;
  }

  .mainImage{
    margin: auto;
    width: 75%;
    right: 0;
    left: 0;
    margin-top: 6px;
  }

  .thumbnails{
    background-color: rgba(192, 192, 192, 0.1);
  width: 100%;
  right: 0px;
  text-align: center;
  margin: auto;
  margin-top: 9px;
  margin-left: 1%;
  }







  .mainimage_haikei{
  background-color: rgba(192,192,192,0.2);
  position:absolute;
  top:346px;
  left:-21px;
  height:280px;
  width:360px;
  }

  .mainImage_iti{
    position:absolute;
   top:-50px;
   left:30px;
  }


  .thumbnails_haikei{
  background-color: rgba(192,192,192,0.1);
  position:absolute;
  top:350px;
  right:80px;
  height:400px;
  width:600px;
  }



  .thumbnails_1{
    width: 35%;
    margin-right: 0%;
    margin-top: 29px;
  }


  .thumbnails_2{
    width: 35%
  }

  .thumbnails_3{
    width: 35%;
      margin-top: 29px;
      margin-right: 0px;
  }


  .thumbnails_4{
    width: 35%;
  }
  .thumbnails img {
      cursor:pointer;
  }

  .change_exercisemore{
    width: 7%;
    position: absolute;
    left: 46%;
  }

  .more_exercise{
    width: 3%;
    position: absolute;
    left: 88%;
  }
  .change_exercise1{
    width: 3%;
    padding-left: -22px;
    margin-right: 12%;
  }
  .change_exercise2{
    width: 3%;
  }
  .change_exercise3{
    width: 3%;
    margin-right: 11%;
  }
  .change_exercise4{
    width: 3%;
  }
  .index3_image_change_img{
    width:88%;
  }
  .index3_image_change{
    padding-top: 11px;
  text-align: left;
  padding-left: 7%;
  }

  .change_exercise_index3_image_change_img{
  width: 92%;
  }

  .tit2 p{
    text-align: center;
      margin-top: 100px;
  }

  .tit2_zisyutore{
    margin: 0;
        font-size: 2.0vw;
        position: absolute;
        top: -2.5%;
        left: 76%;
  }
  .yahoo_sarch8{
        display: none;
  }

  .self_kotoba{
    font-size: 2.9vw;
    width: 97%;
    right: 0px;
    margin: auto;
    margin-top: 14px;
    font-family: "ＭＳ 明朝",serif;
    background-color: rgba(255, 204, 204, 0.1);
  }

  .ankeit_index3_zisyutore{
  position: absolute;
  top: 6.5%;
  left: 59%;
  display:none;
  }

  .modoru{
    cursor: pointer;
    position: absolute;
    top: 75%;
    left: 0;
    right: 0;
    margin: 0 auto;
    width: 100%;
  }




  .warmingup{
    z-index: 100;
    cursor: pointer;
    margin-bottom: -11px;
    width: 25%;
    margin-left: 7%;
  }



  .index3_selfex_insatu{
      display: none;
  }
  .index3_selfex_pdf{
    display: none;
  }







  .index3_undouwodougademiru{
    margin-top: 0px;
  text-align: center;
  }



  .youtube{
    color:#FF0000;
  }

  .undoudouga{
    font-size: 5vw;
    cursor: pointer;
    color: black;
    font-family: "ＭＳ 明朝",serif;
  }


  a.ankeit{
      animation: flashing 1.0s ease-out;
      animation-iteration-count: infinite;    /* 繰り返し回数 または infinite */
      color: #993333;
      position:absolute;
      top:91px;
      left:23px;
      font-family: "ＭＳ 明朝",serif;
  }

  @keyframes flashing {
      0%   { opacity: 0.5; }
      50%  { opacity: 1;}
      100% { opacity: 0.5; }
  }





  /*日常生活の工夫*/

  .index3_nitizyouseikatu_haikei{
    background-image: url(img/Dull.jpg);
   background-size: cover;
   height: 0px;
   object-fit: cover;
   position: relative;
   width: 100%;
   padding-top: 503%;
   background-repeat: no-repeat;
   background-position: center center;
   margin-top: 50px;
  }
  .yahoo_sarch3 {
        display: none;
  }

  .index5_top{
  position: absolute;
    top: 10vw;
    left: 3vw;
  }
  .in5titole{
    margin: 0;
    font-size: 5vw;
    font-family: "ＭＳ 明朝",serif;
    text-align: center;
    margin-top: 11vw;
  }
  .in5hukutitole{
    font-size: 3vw;
      font-family: "ＭＳ 明朝",serif;
      text-align: center;
      margin-top: 8vw;
      margin-left: -14px;
      width: 100%;
  }

  a.ankeit10 {
    animation: flashing 1.0s ease-out;
    animation-iteration-count: infinite;
    color: #993333;
    position: absolute;
    top: -2vw;
    left: 3vw;
    font-family: "ＭＳ 明朝",serif;
    font-size: 3vw;
  }

  .nitizyo{
    color:red;
  }


  .hutanno{
    color:blue;
  }
  .tit3 p{
    font-size: 2vw;
    text-align: center;
    margin-top: 13vw;
  }
  .in5fa{
    color: #0000FF;
  }
  .in5line{
    color:#00FF00;
  }
  .in5twi{
    color:#99CCFF;
  }
  .in5kensaku{
   position: absolute;
   top:150px;
   right:80px;
   font-size:40px;
  }

  .index5_nitizyouseikatu_matome{
    text-align: center;
    margin-top: 11vw;
  }


  .index5_nitizyouseikatu_1{
    width: 66%;
    margin-bottom: 0vw;
    margin-top: 0vw;
  }

  .index5_nitizyouseikatu_2{
    width: 66%;
    margin-bottom: 2vw;
    margin-left: 0vw;
  }

  .index5_nitizyouseikatu_3{
    width: 66%;
  margin-bottom: 0vw;
  margin-left: 2vw;
  }


  .imadekiruex{
    width: 19%;
  position: absolute;
  top: 31vw;
  left: 74vw;
  margin: 0;
  }



  .syuusin6{
    position: absolute;
    top: 38vw;
    left: 74vw;
    width: 17%;
    margin: 0;
  }

  .mainImage2 img{
   text-align:center;
    width:800px;
    position:absolute;
   top:130px;
   left:300px;
  }
  .thumbnails2{
   width:50%;
   margin:0 auto;
   position:absolute;
   top:200px;
   right:-400px;
  }
  .thumbnails2 img{
   width:30%;
  }



  .cp_qa{
    left: 5vw;
    right: 0;
    margin: 0 auto;
    width: 336%;
    margin-top: 12vw;
    margin-left: -2vw;
  }

  .cp_qa *, .cp_qa *:after, .cp_qa *:before {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
  }


  .cp_qa .cp_actab {
    position: relative;
    overflow: hidden;
    width: 30%;
    margin: 0 0 2em 0;
    color: #1b2538;
    font-size: 3vw;
  }
  .cp_qa .cp_actab input {
    position: absolute;
    opacity: 0;
  }
  /* 質問 */
  .cp_qa .cp_actab label {
    font-weight: bold;
    line-height: 1.6em;
    position: relative;
    display: block;
    margin: 0 0 0 0;
    padding: 1em 2em 1em 2.5em;
    cursor: pointer;
    text-indent: 1em;
    border-radius: 0.5em;
    background: rgba(27,37,56,0.1);
  }
  .cp_qa .cp_actab label::before {
    font-family: serif;
    font-size: 1.5em;
    margin-left: -2em;
    padding-right: 0.5em;
    content: 'Q';
  }
  .cp_qa .cp_actab label:hover {
    transition: all 0.3s;
    color: #00838f;
  }
  /* --質問の＋アイコン */
  .cp_qa .cp_actab label::after {
    font-size: 1.7em;
    font-weight: bold;
    line-height: 2em;
    position: absolute;
    top: 0;
    right: 0;
    content: '+';
    display: inline-block;
    width: 2em;
    height: 2em;
    -webkit-transition: transform 0.4s;
            transition: transform 0.4s;
  }
  /* 答え */
  .cp_qa .cp_actab .cp_actab-content {
    position: relative;
    overflow: hidden;
    max-height: 0;
    padding: 0 0 0 2.5em;
    -webkit-transition: max-height 0.2s;
            transition: max-height 0.2s;
    border-radius: 0 0 0.5em 0.5em;
  }
  .cp_qa .cp_actab .cp_actab-content::before {
    font-family: serif;
    font-size: 1.5em;
    position: absolute;
    margin: 0.4em 0 0 -1em;
    padding: 0;
    content: 'A';
  }
  .cp_qa .cp_actab .cp_actab-content p {
    margin: 1em 1em 1em 0;
  }
  /* 質問を開いた時の仕様 */
  /* --答えの高さ */
  .cp_qa .cp_actab input:checked ~ .cp_actab-content {
    max-height: 40em;
    border: 10px solid rgba(27,37,56,0.1);
    font-size: 3vw;
  }
  /* 質問をクリックした時のアイコンの動き */
  .cp_qa .cp_actab input:checked ~ label {
    color: #00838f;
    border-radius: 0.5em 0.5em 0 0;
  }
  /* 質問をクリックした時の+の動き */
  .cp_qa .cp_actab input[type=checkbox]:checked + label::after {
    -webkit-transform: rotateZ(45deg);
    transform: rotateZ(45deg);
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
  }


  /*チェックポイント*/
  .cp_point {
    position: relative;
    padding: 10px 3px 2px 15px;
    border: 3px double #da3c41;
    background-color: #fffafa;
    border-radius: 10px;
    width: 96%;
    right: 0px;
    margin: auto;
    margin-top: 9vw;
    font-size: 3vw;
    margin-left: -2vw;
  }
  .cp_point::before {
    position: absolute;
    top: -1.25em;
    left: 1.5em;
    content: attr(title);
    padding: .3em .5em 0 2em;
    font-size: 90%;
    font-weight: bold;
    color: #da3c41;
    height: 27px;
    background-color: #fcfcfc;
    border-radius: 20px;
    border: 2px solid #da3c41;
    display:none;
  }
  .cp_point::after {
    position: absolute;
    top: -1em;
    left: .5em;
    font-family: FontAwesome;
    content: "\f164 ";
    padding: .3em 0 0 0;
    font-size: 18px;
    color: #fff;
    line-height: 25px;
    text-align: center;
    width: 35px;
    height: 30px;
    background-color: #da3c41;
    border-radius: 20px 0 0 20px;
    display:none;
  }
  .cp_point li {
    position: relative;
    list-style-type: none;
  }
  .cp_point li::before {
    position: absolute;
    top: .25em;
    left: -1.5em;
    font-family: FontAwesome;
    content: "\f138 ";
    color: #bbb;
  }
  .checkpoint{

  }

  /*就寝方法*/

  /*index6 就寝*/
  .bagusyuusei{
    color:black;
    font-size:0px;
  }

  .ankeit11{
  position: absolute;
    top: 3vw;
    left: 2vw;
    font-size: 4vw;
  }

  .index6_top_haikei{
  background-image: url(/Dull.jpg);
  background-size: cover;
  height: 0px;
  object-fit: cover;
  position: relative;
  width: 100%;
  padding-top: 422%;
  background-repeat: no-repeat;
  background-position: center center;
  margin-top: 50px;
  }
  .index6_top{
    position: absolute;
      top: 0vw;

  }
  .syu{
    color:red;
  }
  .in6titole{
    font-size: 6vw;
    font-family: "ＭＳ 明朝",serif;
    margin-top: 23vw;
    text-align: center;
  }
  .in6hukutitole{
    font-size: 4vw;
    font-family: "ＭＳ 明朝",serif;
    margin-top: 2vw;
    text-align: center;
    display: none;
  }
  a.ankeit9 {
    animation: flashing 1.0s ease-out;
    animation-iteration-count: infinite;
    color: #993333;
    position: absolute;
    top: -44px;
    left: 23px;
    font-family: "ＭＳ 明朝",serif;
  }
  .yakantuu{
    color:blue;
  }
  .index6_top p{
    font-size: 2.0vw;
font-family: "ＭＳ 明朝",serif;
position: absolute;
top: -4vw;
left: 72vw;
margin: 0;
  }
  .in6fa{
    color: #0000FF;
  }
  .in6line{
    color:#00FF00;
  }
  .in6twi{
    color:#99CCFF;
  }
  .yahoo_sarch6 {
    display: none;
  }




  .syuusinsyasin_matome{
    text-align: center;
    margin-top: 7vw;
    margin-left: 2vw;
  }


  .syuusinsyasin1{
    width: 80%;
  }

  .syuusinsyasin2{
    width: 80%;
      margin-top: 2vw;
  }

  .syuusinsyasin3{
    width: 80%;
      margin-top: 2vw;
  }

  .syuusinsyasin4{
    width: 80%;
    margin-top: 2vw;
  }







  .syuusinsyasin{
  position: absolute;
   top:200px;
   right:150px;
  }

  .nitizyouseikatu6{
    position: absolute;
      top: 8vw;
      left: 68vw;
      width: 24%;
      margin: 0;
  }

  /* 質問 */



  #QandA-2 {
    width: 93%;
    font-family: メイリオ;
    font-size: 15px;
    right: 0px;
    margin: auto;
    margin-top: 8vw;
  }
  #QandA-2 h3 {
    font-size: 16px;
    margin-top: 32px;
  }
  #QandA-2 dl {
    border: 1px solid #ccc;
    margin-bottom: 14vw;
  }
  #QandA-2 dt {
  font-weight: bold;
    color: #111;
    background: #f4f4f4; /* 「Q」タイトルの背景色 */
    padding: 8px;
    border-top: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
  }
  #QandA-2 dt:first-child {
    border-top: none;
        font-size: 3vw;
  }
  #QandA-2 dt:before {
    content: "Q.";
    font-weight: bold;
    margin-right: 8px;
  }
  #QandA-2 dd {
      padding: 7px 2px 2px 4px;
    margin: 0;
    line-height: 140%;
        font-size: 3vw;
  }
  #QandA-2 dd:first-line {
    font-weight: bold;
    color: #bf0000;
  }
  #QandA-2 dd:before {
    content: "A.";
    font-weight: bold;
    margin-right: 8px;
    margin-left: -21px;
  }


    /*チェックポイント*/
    .cp_point6 {
      padding: 5px 1px 5px 8px;
    border: 1px double #da3c41;
    background-color: #fffafa;
    border-radius: 10px;
    width: 96%;
    right: 0px;
    margin: 0;
    margin-top: 10vw;
    }
    .cp_point6::before {
      position: absolute;
      top: -1.25em;
      left: 1.5em;
      content: attr(title);
      padding: .3em .5em 0 2em;
      font-size: 90%;
      font-weight: bold;
      color: #da3c41;
      height: 27px;
      background-color: #fcfcfc;
      border-radius: 20px;
      border: 2px solid #da3c41;
      display: none;
    }
    .cp_point6::after {
      position: absolute;
      top: -1em;
      left: .5em;
      font-family: FontAwesome;
      content: "\f164 ";
      padding: .3em 0 0 0;
      font-size: 18px;
      color: #fff;
      line-height: 25px;
      text-align: center;
      width: 35px;
      height: 30px;
      background-color: #da3c41;
      border-radius: 20px 0 0 20px;
      display: none;
    }
    .cp_point6 li {
      position: relative;
    list-style-type: none;
    font-size: 4vw;
    }

}

































@media screen and (max-width: 479px) {
  li {
    list-style: none;
  }

  .header {
    background-color: #000000;
    color: #ffffff;
    height: 34px;
   margin-bottom:-50px;
  }

  .header-logo {
    float: left;
    font-size: 15px;
    padding: 7px 100px 20px 20px;
    font-family: "ＭＳ 明朝",serif;
    color: #ffffff;
  }

  .header-list {
    float: left;
    padding-left:200px;
    display: none;
  }

  .header-list li {
    float: left;
    font-size:20px;
    padding-right: 200px;
    font-family: "ＭＳ 明朝",serif;
  }

  .header-logo-li1{
    color: #ffffff;
  }

  /*タイトル　Shoulder check*/

  .haike3{
    background-image: url(http://katatest.moo.jp/katano-katari/css/shoulders.jpg);
   background-size: cover;
   height: 0px;
   object-fit: cover;
   position: relative;
   width: 100%;
   padding-top: 178%;
   background-repeat: no-repeat;
   background-position: center center;
   margin-top: 50px;
  }



  .tit{


  }

  .tit h1{
    font-size: 5vw;
    font-family: "ＭＳ 明朝",serif;
    margin: 0;
    position: absolute;
    top: 10%;
    left: 31%;
  }

  /*タイトル　Shoulder check デザイン*/
  .S{
    color:#AA0000;
  }
  .C{
    color:#AA0000;
  }

  /*タイトル　自分の肩の状態をチェックしよう*/

  .tit h2{
    font-family: "ＭＳ 明朝",serif;
    margin: 0;
    position: absolute;
    top: 18%;
    left:29%;
    right: 0;
    padding: 0;
  font-size: 3vw;
  }

  /*タイトル　自分の肩の状態をチェックしよう デザイン*/



  .tit p{
    font-size: 1.5vw;
      margin: 0;
      position: absolute;
      top: 3%;
      left: 71%;
  }
  .my-skyblue{
    color: #0000FF;
  }
  .my-youtube{
    color:#FF0000;
  }
  .my-twitter{
    color:#99CCFF;
  }

  .yahoo_sarch{
   position: absolute;
   top:160px;
   right:70px;
   display: none;
  }

  /*menuボタン*/

  .check_menu{
    top: 66%;
    left: 31%;
    position: absolute;
    width: 50%;
  }

  .check_menu ul {
    width: 36vw;
    margin: 0;
    padding: 0;
    list-style-type: none;
    background-color: #eeeeee;
  }
  .check_menu li a {
    display: block;
      padding: 8px 16px;
      text-decoration: none;
      color: #000000;
      font-size: 3.5vw;

  }
  .check_menu li {
    text-align: center;
  }
  .check_menu li:last-child {
    border-bottom: none;
  }
  .active {
    color:#FFFFFF;
    background-color: #da3c41;
  }
  .check_menu li a:hover:not(.active) {
    color: #ffffff;
    background-color: #1b2538;
  }

  .contents_a{
      font-size:10px;
      padding:0px;
      margin-top:0px;
        text-align:left;
  }

  .contents_b{
      font-size:10px;
      padding:0px;
      margin-top:0px;
      text-align:center;
  }

  .kozintekiburogu_setumei{
    font-size: 2.7vw;
    width: 100%;
    background-color: #EEEEEE;
    margin-top: 4vw;
  }



  .riyoukiyaku_iti{
    text-align: center;
    position: absolute;
    text-decoration: none;
    top: -3vw;
    left: 4vw;
    font-size: 1.7vw;
  }





  /*shoulder check 開始ボタン*/

  /*shoulder check 開始ボタン 位置の変更*/
  .nitak-gazou1{
    width: 28%;
    top: 34%;
    margin: 0 auto;
    left: 0%;
    right: 0%;
    position: absolute;

  }

  .nitak-gazou1 h1{
    left: 23%;
      font-family: "ＭＳ 明朝",serif;
      font-size: 4vw;
      color: #FF5722;
      margin: 0;
      position: absolute;
      top: 111%;
  }


  a.btn_start {
    display: block;
    text-align: center;
    text-decoration: none;
    color: #FF5722;
    width: 24vw;
    height: 24vw;
    line-height: 24vw;
    border: double 4px #FF5722;
    border-radius: 50%;
    vertical-align: middle;
    overflow: hidden;
    transition: .6s;
    background: white;
    font-size: 4vw;
  }
  a.btn_start:hover {
    transform: rotateY(360deg);
    background: #EC407A;
    color:white;
    border: double 4px white;
  }


/*　基本情報*/
  .kihonzyouhou2{
    background-color: #FFFFCC;
    width:360px;
    padding: 10px;
    position: absolute;
    top:200px;
    left:400px;
  }


  /*アンケート選択*/

  /*意味ないかも*/
  .Question:not(:first-of-type) {
    display: none;
  }



  #q1, #q2, #q3, #q4, #q5, #q6, #q7, #q8, #q9, #q10, #q11, #q12, #q13, #q14, #q15, #q16, #q20, #q21, #q22, #q17, #q18{
    width: 100%;
      top: -123vw;
      margin: 0 auto;
      left: 0;
      position: relative;
      height: 0;
      padding-top: 61%;
  }


   #Ans1, #Ans2, #Ans3, #Ans4, #Ans5, #Ans6{
     width: 100%;
    top: -119vw;
    margin: 0 auto;
    left: 0;
    position: relative;
    height: 0;
    padding-top: 61%;
   }

  .imag1{
    position: absolute;
    height: auto;
    top: 0;
    left: 0px;
    width: 100%;
  }

  .imag2{
    position: absolute;
    height: 49%;
    top: 37%;
    left: 61%;
  }

  .imag3{
    position: absolute;
    height: 50%;
    top: 31%;
    left: 64%;
  }

  .imag4{
    position: absolute;
    height: 54%;
    top: 24%;
    left: 76%;
  }

  .imag5{
    position: absolute;
height: 54%;
top: 28%;
left: 79%;

  }


  .QUE{
    font-family: "ＭＳ 明朝",serif;
    font-size: 6vw;
    color: #FF9966;
    position: absolute;
    top: -5%;
    left: 3%;
  }

  .koumoku{
    font-family: "ＭＳ 明朝",serif;
    font-size: 4vw;
    position: absolute;
    top: 15%;
    left: 3%;
  }

  .yes{
    height: 33%;
    position: absolute;
    top: 44%;
    left: 8%;
  }

  .no{
    height: 33%;
      position: absolute;
      top: 44%;
      left: 34%;
  }



  .uemuki7{
    position: absolute;
    right:550px;
    top:420px;
  }

  .yokomuki-sita7{
    position: absolute;
    right:540px;
    top:470px;
  }

  .yikomuki-ue7{
    position: absolute;
    right:540px;
    top:530px;
  }


  /*アンケート結果*/
  .answer1{
    width: 313px;
     top: -96px;
     margin: 0 auto;
     left: -377px;
  }

  .ansimag2{
    position: absolute;
    height: 60vw;
    top: 0;
    left: 0px;
    width: 100%;
  }

  .anskekka{
    font-family: "ＭＳ 明朝",serif;
    font-size: 6vw;
    color: #FF9966;
    position: absolute;
    top: 2%;
    left: 7%;
  }

  .kekkasetumei{
    font-family: "ＭＳ 明朝",serif;
    font-size: 3vw;
    width: 90%;
    position: absolute;
    top: 33%;
    left: 7%;
    margin: 0;
  }

  .syuusin{
    cursor: pointer;
    height: 10%;
    position: absolute;
    top: 74%;
    left: 14%;
  }

  .nitizyouseikatu{
    cursor: pointer;
    height: 10%;
    position: absolute;
    top: 74%;
    left: 49%;
  }

  .undou_strech{
    cursor: pointer;
    height: 10%;
    position: absolute;
    top: 78%;
    left: 29%;
  }


  .selfexecise{
    margin-top: 10px;
    text-align: center;
  }

  .selfexecise h1{
    font-size: 7vw;
      margin: 0;
  }
  .index3_syusinto_nitizyouseikatu_matome{
    text-align: center;
        margin-top: 27px;
  }

  .syuusin7{
    width: 90px;
  }
  .nitizyouseikatu7{
    width: 109px;
  }



.haikei4{
  background-image: url(/Dull.jpg);
 background-size: cover;
 height: 0px;
 object-fit: cover;
 position: relative;
 width: 100%;
 padding-top: 209%;
 background-repeat: no-repeat;
 background-position: center center;
 margin-top: 50px;
}

.index4_haikeinaka{
  position: absolute;
  top:0%;
  left:0%;
}


  .mainImage img{
    text-align: center;
     width: 100%;
  }

  .mainImage{
    margin: auto;
    width: 75%;
    right: 0;
    left: 0;
    margin-top: 6px;
  }

  .thumbnails{
    background-color: rgba(192, 192, 192, 0.1);
  width: 100%;
  right: 0px;
  text-align: center;
  margin: auto;
  margin-top: 9px;
  margin-left: 1%;
  }







  .mainimage_haikei{
  background-color: rgba(192,192,192,0.2);
  position:absolute;
  top:346px;
  left:-21px;
  height:280px;
  width:360px;
  }

  .mainImage_iti{
    position:absolute;
   top:-50px;
   left:30px;
  }


  .thumbnails_haikei{
  background-color: rgba(192,192,192,0.1);
  position:absolute;
  top:350px;
  right:80px;
  height:400px;
  width:600px;
  }



  .thumbnails_1{
    width: 35%;
    margin-right: 0%;
    margin-top: 29px;
  }


  .thumbnails_2{
    width: 35%
  }

  .thumbnails_3{
    width: 35%;
      margin-top: 29px;
      margin-right: 0px;
  }


  .thumbnails_4{
    width: 35%;
  }
  .thumbnails img {
      cursor:pointer;
  }

  .change_exercisemore{
    width: 7%;
    position: absolute;
    left: 46%;
  }

  .more_exercise{
    width: 3%;
    position: absolute;
    left: 88%;
  }
  .change_exercise1{
    width: 3%;
    padding-left: -22px;
    margin-right: 12%;
  }
  .change_exercise2{
    width: 3%;
  }
  .change_exercise3{
    width: 3%;
    margin-right: 11%;
  }
  .change_exercise4{
    width: 3%;
  }
  .index3_image_change_img{
    width:88%;
  }
  .index3_image_change{
    padding-top: 11px;
  text-align: left;
  padding-left: 7%;
}

.change_exercise_index3_image_change_img{
  width: 92%;
}

  .tit2 p{
    text-align: center;
      margin-top: 100px;
  }

.tit2_zisyutore{
  margin: 0;
font-size: 3vw;
position: absolute;
top: -4%;
left: 59%;
}
  .yahoo_sarch8{
        display: none;
  }

  .self_kotoba{
    font-size: 2.9vw;
    width: 97%;
    right: 0px;
    margin: auto;
    margin-top: 14px;
    font-family: "ＭＳ 明朝",serif;
    background-color: rgba(255, 204, 204, 0.1);
  }

.ankeit_index3_zisyutore{
  position: absolute;
  top: 6.5%;
  left: 59%;
  display:none;
}

  .modoru{
    cursor: pointer;
    position: absolute;
    top: 75%;
    left: 0;
    right: 0;
    margin: 0 auto;
    width: 100%;
  }




  .warmingup{
    z-index: 100;
    cursor: pointer;
    margin-bottom: -11px;
    width: 25%;
    margin-left: 7%;
  }


  .index3_selfex_insatu{
      display: none;
  }
  .index3_selfex_pdf{
      display: none;
  }



  .index3_undouwodougademiru{
    margin-top: 0px;
text-align: center;
  }



  .youtube{
    color:#FF0000;
  }

  .undoudouga{
    font-size: 5vw;
    cursor: pointer;
    color: black;
    font-family: "ＭＳ 明朝",serif;
  }


  a.ankeit{
      animation: flashing 1.0s ease-out;
      animation-iteration-count: infinite;    /* 繰り返し回数 または infinite */
      color: #993333;
      position:absolute;
      top:91px;
      left:23px;
      font-family: "ＭＳ 明朝",serif;
  }

  @keyframes flashing {
      0%   { opacity: 0.5; }
      50%  { opacity: 1;}
      100% { opacity: 0.5; }
  }





  /*日常生活の工夫*/

  .index3_nitizyouseikatu_haikei{
    background-image: url(/Dull.jpg);
   background-size: cover;
   height: 0px;
   object-fit: cover;
   position: relative;
   width: 100%;
   padding-top: 601%;
   background-repeat: no-repeat;
   background-position: center center;
   margin-top: 50px;
  }
  .yahoo_sarch3 {
        display: none;
  }

.index5_top{
  position: absolute;
    top: 10vw;
    left: 3vw;
}
  .in5titole{
    margin: 0;
    font-size: 5vw;
    font-family: "ＭＳ 明朝",serif;
    text-align: center;
    margin-top: 11vw;
  }
  .in5hukutitole{
    font-size: 3vw;
      font-family: "ＭＳ 明朝",serif;
      text-align: center;
      margin-top: 8vw;
      margin-left: -14px;
      width: 100%;
  }

  a.ankeit10 {
    animation: flashing 1.0s ease-out;
    animation-iteration-count: infinite;
    color: #993333;
    position: absolute;
    top: -2vw;
    left: 3vw;
    font-family: "ＭＳ 明朝",serif;
    font-size: 3vw;
  }

  .nitizyo{
    color:red;
  }


  .hutanno{
    color:blue;
  }
  .tit3 p{
    font-size: 2vw;
    text-align: center;
    margin-top: 13vw;
  }
  .in5fa{
    color: #0000FF;
  }
  .in5line{
    color:#00FF00;
  }
  .in5twi{
    color:#99CCFF;
  }
  .in5kensaku{
   position: absolute;
   top:150px;
   right:80px;
   font-size:40px;
  }

  .index5_nitizyouseikatu_matome{
    text-align: center;
    margin-top: 11vw;
  }


  .index5_nitizyouseikatu_1{
    width: 66%;
    margin-bottom: 0vw;
    margin-top: 0vw;
  }

  .index5_nitizyouseikatu_2{
    width: 66%;
    margin-bottom: 2vw;
    margin-left: 0vw;
  }

  .index5_nitizyouseikatu_3{
    width: 66%;
  margin-bottom: 0vw;
  margin-left: 2vw;
  }


  .imadekiruex{
    width: 19%;
position: absolute;
top: 31vw;
left: 74vw;
margin: 0;
  }



  .syuusin6{
    position: absolute;
    top: 38vw;
    left: 74vw;
    width: 17%;
    margin: 0;
  }

  .mainImage2 img{
   text-align:center;
    width:800px;
    position:absolute;
   top:130px;
   left:300px;
  }
  .thumbnails2{
   width:50%;
   margin:0 auto;
   position:absolute;
   top:200px;
   right:-400px;
  }
  .thumbnails2 img{
   width:30%;
  }



  .cp_qa{
    left: 5vw;
    right: 0;
    margin: 0 auto;
    width: 336%;
    margin-top: 12vw;
    margin-left: -2vw;
  }

  .cp_qa *, .cp_qa *:after, .cp_qa *:before {
  	-webkit-box-sizing: border-box;
  	        box-sizing: border-box;
  }


  .cp_qa .cp_actab {
  	position: relative;
  	overflow: hidden;
  	width: 30%;
  	margin: 0 0 2em 0;
  	color: #1b2538;
    font-size: 3vw;
  }
  .cp_qa .cp_actab input {
  	position: absolute;
  	opacity: 0;
  }
  /* 質問 */
  .cp_qa .cp_actab label {
  	font-weight: bold;
  	line-height: 1.6em;
  	position: relative;
  	display: block;
  	margin: 0 0 0 0;
  	padding: 1em 2em 1em 2.5em;
  	cursor: pointer;
  	text-indent: 1em;
  	border-radius: 0.5em;
  	background: rgba(27,37,56,0.1);
  }
  .cp_qa .cp_actab label::before {
  	font-family: serif;
  	font-size: 1.5em;
  	margin-left: -2em;
  	padding-right: 0.5em;
  	content: 'Q';
  }
  .cp_qa .cp_actab label:hover {
  	transition: all 0.3s;
  	color: #00838f;
  }
  /* --質問の＋アイコン */
  .cp_qa .cp_actab label::after {
  	font-size: 1.7em;
  	font-weight: bold;
  	line-height: 2em;
  	position: absolute;
  	top: 0;
  	right: 0;
  	content: '+';
  	display: inline-block;
  	width: 2em;
  	height: 2em;
  	-webkit-transition: transform 0.4s;
  	        transition: transform 0.4s;
  }
  /* 答え */
  .cp_qa .cp_actab .cp_actab-content {
  	position: relative;
  	overflow: hidden;
  	max-height: 0;
  	padding: 0 0 0 2.5em;
  	-webkit-transition: max-height 0.2s;
  	        transition: max-height 0.2s;
  	border-radius: 0 0 0.5em 0.5em;
  }
  .cp_qa .cp_actab .cp_actab-content::before {
  	font-family: serif;
  	font-size: 1.5em;
  	position: absolute;
  	margin: 0.4em 0 0 -1em;
  	padding: 0;
  	content: 'A';
  }
  .cp_qa .cp_actab .cp_actab-content p {
  	margin: 1em 1em 1em 0;
  }
  /* 質問を開いた時の仕様 */
  /* --答えの高さ */
  .cp_qa .cp_actab input:checked ~ .cp_actab-content {
  	max-height: 40em;
  	border: 10px solid rgba(27,37,56,0.1);
    font-size: 3vw;
  }
  /* 質問をクリックした時のアイコンの動き */
  .cp_qa .cp_actab input:checked ~ label {
  	color: #00838f;
  	border-radius: 0.5em 0.5em 0 0;
  }
  /* 質問をクリックした時の+の動き */
  .cp_qa .cp_actab input[type=checkbox]:checked + label::after {
  	-webkit-transform: rotateZ(45deg);
  	transform: rotateZ(45deg);
  	-webkit-transform-origin: 50% 50%;
  	transform-origin: 50% 50%;
  }


  /*チェックポイント*/
  .cp_point {
    position: relative;
    padding: 10px 3px 2px 15px;
    border: 3px double #da3c41;
    background-color: #fffafa;
    border-radius: 10px;
    width: 96%;
    right: 0px;
    margin: auto;
    margin-top: 9vw;
    font-size: 3vw;
    margin-left: -2vw;
  }
  .cp_point::before {
  	position: absolute;
  	top: -1.25em;
  	left: 1.5em;
  	content: attr(title);
  	padding: .3em .5em 0 2em;
  	font-size: 90%;
  	font-weight: bold;
  	color: #da3c41;
  	height: 27px;
  	background-color: #fcfcfc;
  	border-radius: 20px;
  	border: 2px solid #da3c41;
    display:none;
  }
  .cp_point::after {
  	position: absolute;
  	top: -1em;
  	left: .5em;
  	font-family: FontAwesome;
  	content: "\f164 ";
  	padding: .3em 0 0 0;
  	font-size: 18px;
  	color: #fff;
  	line-height: 25px;
  	text-align: center;
  	width: 35px;
  	height: 30px;
  	background-color: #da3c41;
  	border-radius: 20px 0 0 20px;
    display:none;
  }
  .cp_point li {
  	position: relative;
  	list-style-type: none;
  }
  .cp_point li::before {
  	position: absolute;
  	top: .25em;
  	left: -1.5em;
  	font-family: FontAwesome;
  	content: "\f138 ";
  	color: #bbb;
  }
  .checkpoint{

  }

/*就寝方法*/

/*index6 就寝*/
  .bagusyuusei{
    color:black;
    font-size:0px;
  }

.ankeit11{
  position: absolute;
    top: 3vw;
    left: 2vw;
    font-size: 4vw;
}

.index6_top_haikei{
  background-image: url(/Dull.jpg);
 background-size: cover;
 height: 0px;
 object-fit: cover;
 position: relative;
 width: 100%;
 padding-top: 422%;
 background-repeat: no-repeat;
 background-position: center center;
 margin-top: 50px;
}
  .index6_top{
    position: absolute;
      top: 0vw;

  }
  .syu{
    color:red;
  }
  .in6titole{
    font-size: 6vw;
    font-family: "ＭＳ 明朝",serif;
    margin-top: 23vw;
    text-align: center;
  }
  .in6hukutitole{
    font-size: 4vw;
    font-family: "ＭＳ 明朝",serif;
    margin-top: 2vw;
    text-align: center;
    display: none;
  }
  a.ankeit9 {
    animation: flashing 1.0s ease-out;
    animation-iteration-count: infinite;
    color: #993333;
    position: absolute;
    top: -44px;
    left: 23px;
    font-family: "ＭＳ 明朝",serif;
}
  .yakantuu{
    color:blue;
  }
  .index6_top p{
    font-size: 2.5vw;
    font-family: "ＭＳ 明朝",serif;
    position: absolute;
    top: -6vw;
    left: 65vw;
    margin: 0;
  }
  .in6fa{
    color: #0000FF;
  }
  .in6line{
    color:#00FF00;
  }
  .in6twi{
    color:#99CCFF;
  }
  .yahoo_sarch6 {
    display: none;
  }




  .syuusinsyasin_matome{
    text-align: center;
    margin-top: 7vw;
    margin-left: 2vw;
  }


  .syuusinsyasin1{
    width: 80%;
  }

  .syuusinsyasin2{
    width: 80%;
      margin-top: 2vw;
  }

  .syuusinsyasin3{
    width: 80%;
      margin-top: 2vw;
  }

  .syuusinsyasin4{
    width: 80%;
    margin-top: 2vw;
  }







  .syuusinsyasin{
  position: absolute;
   top:200px;
   right:150px;
  }

  .nitizyouseikatu6{
    position: absolute;
      top: 8vw;
      left: 68vw;
      width: 24%;
      margin: 0;
  }

  /* 質問 */



  #QandA-2 {
    width: 93%;
    font-family: メイリオ;
    font-size: 15px;
    right: 0px;
    margin: auto;
    margin-top: 8vw;
  }
  #QandA-2 h3 {
    font-size: 16px;
    margin-top: 32px;
  }
  #QandA-2 dl {
    border: 1px solid #ccc;
    margin-bottom: 14vw;
  }
  #QandA-2 dt {
  font-weight: bold;
    color: #111;
    background: #f4f4f4; /* 「Q」タイトルの背景色 */
    padding: 8px;
    border-top: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
  }
  #QandA-2 dt:first-child {
    border-top: none;
        font-size: 3vw;
  }
  #QandA-2 dt:before {
    content: "Q.";
    font-weight: bold;
    margin-right: 8px;
  }
  #QandA-2 dd {
      padding: 7px 2px 2px 4px;
    margin: 0;
    line-height: 140%;
        font-size: 3vw;
  }
  #QandA-2 dd:first-line {
    font-weight: bold;
    color: #bf0000;
  }
  #QandA-2 dd:before {
    content: "A.";
    font-weight: bold;
    margin-right: 8px;
    margin-left: -21px;
  }


    /*チェックポイント*/
    .cp_point6 {
      padding: 5px 1px 5px 8px;
    border: 1px double #da3c41;
    background-color: #fffafa;
    border-radius: 10px;
    width: 96%;
    right: 0px;
    margin: 0;
    margin-top: 10vw;
    }
    .cp_point6::before {
      position: absolute;
      top: -1.25em;
      left: 1.5em;
      content: attr(title);
      padding: .3em .5em 0 2em;
      font-size: 90%;
      font-weight: bold;
      color: #da3c41;
      height: 27px;
      background-color: #fcfcfc;
      border-radius: 20px;
      border: 2px solid #da3c41;
      display: none;
    }
    .cp_point6::after {
      position: absolute;
      top: -1em;
      left: .5em;
      font-family: FontAwesome;
      content: "\f164 ";
      padding: .3em 0 0 0;
      font-size: 18px;
      color: #fff;
      line-height: 25px;
      text-align: center;
      width: 35px;
      height: 30px;
      background-color: #da3c41;
      border-radius: 20px 0 0 20px;
      display: none;
    }
    .cp_point6 li {
      position: relative;
    list-style-type: none;
    font-size: 4vw;
    }
}
