@charset "UTF-8";
/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝　初期設定　＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */

*{
  margin: 0px;
  padding: 0px;
  box-sizing: border-box;
  font-family: "メイリオ","Meiryo UI","Hiragino Kaku Gothic ProN", sans-serif;
}
img{
  vertical-align: middle;　
}
/* ＝＝＝＝＝＝＝＝＝＝＝＝＝　ページレイアウト　＝＝＝＝＝＝＝＝＝＝＝＝＝ */
@media print {
  body{
  display: none ; 
}
}

#outer-frame{
  width: 98%;
  border: 1px solid #0000a0;
  background: #ffffff;
  padding:0 0;
  margin: 0px 3px;
}
@media only screen and (min-width:651px) {
  #outer-frame{
  width: 800px;
  padding:0 0;
  margin: 10px auto;
}
}

/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝　タイトル　ヘッダー　＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
header{
  width: 100%;
}
.pc{
  display: none !important;
}
.sp{
  display: block !important;
  width: 100%;
}
@media only screen and (min-width:651px) {
  #header-img{
  width: 798px;
}
.pc{
  display: block !important;
}
.sp{
  display: none !important;
}
}

/* ＝＝＝＝＝＝＝＝＝＝＝＝＝　ナビゲーション　＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */

#navi-zone{
  padding: 0px 0px;
  background: #909;
  width: 100%;
}
@media only screen and (min-width:651px) {
  #navi-zone{
  padding: 2px 2px 2px 2px;
  vertical-align: middle;
　
       }
}

nav ul{
  list-style-type: none;
}
nav li{
  width: 50%;
  float: left;
  border-bottom: solid 1px #dff;
}
nav li:nth-child(odd){
  border-right: solid 1px #dff;
}
@media only screen and (min-width:651px) {
  nav li{
  width: 16.66666667%;
  border-right: solid 1px #dff;
  border-top: solid 1px #dff;
  border-bottom: solid 1px #dff;
}
nav li:first-child{
  border-left: solid 1px #dff;
}
}
nav a{
  display: block;
  background: #008;
  color: #FFF;
  font-weight: bold;
  font-size: 15px;
  line-height: 45px;
  padding-left: 15px;
  text-decoration: none;
}
@media only screen and (min-width:651px) {
  nav a{
  line-height: 36px;
  text-align: center;
  padding-left: 0;
}
}
nav a:hover{
  background: #0FF;
}
nav ul::after{
  display: table;
  content: "";
  clear: both;
}

.pankuzu{
  font-size: 14px;
  margin: 10px 10px;
  padding: 5px 5px;
  border-bottom: 2px solid #cccccc
;
}
@media only screen and (min-width:651px) {
  .pankuzu{
  font-size: 12px;
  font-weight: bold;
  margin: 5px 10px;
  padding: 5px 10px 1px 10px ;
}
}

.pankuzu a{
  font-size: 14px;
}
@media only screen and (min-width:651px) {
  .pankuzu a{
  font-size: 12px;
  font-weight: bold;
}
}

.pankuzu ol{
  list-style-type: none;
}
.pankuzu li{
  display: inline;
  margin: 0px 5px
;
}
.pankuzu li::after{
  content: " ->"
;
}
.pankuzu li:last-child::after{
  content: none
;
}
.pankuzu-b{
  font-size: 14px;
  margin: 10px 10px;
  padding: 5px 5px;
  border-top: 2px solid #cccccc
;
}
@media only screen and (min-width:651px) {
  .pankuzu-b{
  font-size: 12px;
  font-weight: bold;
  margin: 5px 10px;
  padding: 5px 10px 1px 10px ;
}
}
.pankuzu-b a{
  font-size: 14px;
}
@media only screen and (min-width:651px) {
  .pankuzu-b a{
  font-size: 12px;
  font-weight: bold;
}
}
.pankuzu-b ol{
  list-style-type: none;
}
.pankuzu-b li{
  display: inline;
  margin: 0px 5px
;
}
.pankuzu-b li::after{
  content: " ->"
;
}
.pankuzu-b li:last-child::after{
  content: none
;
}

.sitemap{
  font-size : 12px;
  font-weight : normal;
  color : navy;
  line-height : 120%;
}
@media only screen and (min-width:651px) {
  .sitemap{
  font-weight : bold;
  font-size : 14px;
  color : navy;
  line-height : 120%;
}
}

/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝　メイン用　＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
    
#main-zone{
  width: 100%;
  padding:  0 10px;
  margin: 0 auto;
  font-size: 16px;
  line-height: 1.5;
}
@media only screen and (min-width:651px) {
  #main-zone{
  width: 650px;
  margin: 5px auto;
  padding:  0 0;
  font-size: 18px;
  line-height: 200%;
}
}

#main section{
  margin-bottom: 60px;
}

#mokuji li{
  margin: 8px 0 8px 0;
  list-style: none;
}
@media only screen and (min-width:651px) {
  #mokuji li{
  margin: 10px 0 10px 10px
	;
}
}
@media print {
  body{
  display: none ;
}
}

.base-fontsize{
  font-size: 16px;
  line-height: 180%;
}
@media only screen and (min-width:651px) {
  .base-fontsize{
  font-size: 18px;
  line-height: 200%;
  color: black;
  font-weight: normal;
}
}

.include-zone{
  width: 100%;
  padding: 10px 10px;
  margin: 10px auto;
  font-size: 16px;
  color : navy;
  line-height: 1.5;
}
@media only screen and (min-width:651px) {
  .include-zone{
  width: 640px;
  margin: 10px auto;
  padding:  10px 25px;
  font-size: 15px;
  font-weight: normal;
  color : navy;
  line-height: 180%;
}
}

.double-line{
    border: 3px double #000000; 
    padding: 10px 10px;
}
@media only screen and (min-width:651px) {
   .double-line{
    padding: 10px 10px;
}
}

.kokuban{
    width: 100%;
    border: 8px solid #990000;
  padding: 10px 10px;
  margin: 10px 0px;
  background-color: #006666;
  color : white;
  font-size : 18px;
  font-weight: bold;
  line-height : 160%;
}
@media only screen and (min-width:651px) {
  .kokuban{
    width: 650px;
    border: 10px solid #990000;
  padding: 10px 20px;
  background-color: #006666;
  color : white;
  font-size : 35px;
  font-weight: bold;
  line-height : 180%;
}
}

.navy-board{
    border-radius: 15px;
    width: 100%;
    border: 10px solid #66FFFF; 
    padding: 10px 10px;
    margin: 10px 0px;
  background-color: #000066;
}
@media only screen and (min-width:651px) {
   .navy-board{
    width: 100%;
    border: 15px solid #66FFFF; 
    padding: 10px 15px;
  background-color: #000066;
}
}

.cork-board{
    width: 100%;
    border: 10px solid #700000; 
    padding: 20px 30px;
}
@media only screen and (min-width:651px) {
   .cork-board{
    width: 650px;
    border: 15px solid #700000; 
}
}

.kajougaki{
  margin: 5px 0px 5px 10px;
}
@media only screen and (min-width:651px) {
  .kajougaki{
  margin: 5px 0px 5px 25px;
}
}

.kajougaki li{
  margin: 5px 0px 5px 10px;
  list-style: disc;
}
@media only screen and (min-width:651px) {
  .kajougaki li{
  margin: 5px 0px 5px 0px;
  list-style: disc;
}
}

.numberlist{
  margin: 5px 0px 5px 20px;
}
@media only screen and (min-width:651px) {
  .numberlist{
  margin: 5px 0px 5px 30px;
}
}

.ol li{
  margin: 5px 0px 5px 10px;
  list-style: decimal;
}
@media only screen and (min-width:651px) {
  .ol li{
  margin: 5px 0px 5px 0px;
  list-style: decimal;
} 
}


/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝　フォント　＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
p{
  margin: 20px 0px 20px 0px;
}

hr{
  margin: 10px 0px 10px 0px;
}


h1{
  line-height: 150%;
  font-size: 20px;
  color: #00f;
  margin-bottom : 5px;
  border-bottom: solid 2px #f0f;
}

h2{
  line-height: 120%;
  font-size: 18px;
  color: #336;
  margin-bottom : 3px;
  border-bottom: solid 2px #300;
}
@media only screen and (min-width:651px) {
  h1{
  font-size: 26px;
  margin-top: 30px;
}
h2{
  font-size: 24px;
  margin-top: 30px;
}
}

h3{
  font-size : 18px;
  color : white;
  background-color : navy;
  font-weight : bold;
  line-height : 250%;
  margin: 20px 0px 15px 0px;
  padding: 0px 20px 0px 20px;
}
@media only screen and (min-width:651px) {
  h3{
  font-size : 24px;
  line-height : 300%;
}
}

h4{
  font-size : 18px;
  color : white;
  background-color : red;
  font-weight : bold;
  line-height : 250%;
  margin: 10px 0px 15px 0px;
  padding: 0px 20px 0px 20px;
}
@media only screen and (min-width:651px) {
  h4{
  font-size : 24px;
  line-height : 300%;
}
}

b{
  color : blue;
  font-weight : bold;
  font-size : 16px;
  line-height : 180%;
}
@media only screen and (min-width:651px) {
  b{
  font-size: 18px;
  line-height: 200%;
}
}

.navy-bold{
  font-size : 16px;
  color : navy;
  font-weight : bold;
  line-height : 180%;
}
@media only screen and (min-width:651px) {
  .navy-bold{
  font-size : 18px;
  line-height : 200%;
}
}

.red-bold{
  font-size : 16px;
  color : red;
  font-weight : bold;
  line-height : 180%;
}
@media only screen and (min-width:651px) {
  .red-bold{
  font-size : 18px;
  line-height : 200%;
}
}

.white-bold{
  font-size : 16px;
  color : white;
  font-weight : bold;
  line-height : 180%;
}
@media only screen and (min-width:651px) {
  .white-bold{
  font-size : 18px;
  line-height : 200%;
}
}

.navybold-yellowback{
  font-size : 16px;
  color : navy;
  background-color : #ffff88;
  font-weight : bold;
  line-height : 180%;
}
@media only screen and (min-width:651px) {
  .navybold-yellowback{
  font-size : 18px;
  line-height : 200%;
}
}

.whitebold-navyback{
  font-size : 16px;
  color : white;
  background-color : navy;
  font-weight : bold;
  line-height : 180%;
}
@media only screen and (min-width:651px) {
  .whitebold-navyback{
  font-size : 18px;
  line-height : 200%;
}
}

.whitebold-navyback_20p{
  font-size : 18px;
  color : white;
  background-color : navy;
  font-weight : bold;
  line-height : 180%;
}
@media only screen and (min-width:651px) {
  .whitebold-navyback_20p{
  font-size : 20px;
  line-height : 200%;
}
}

.yellowbold-navyback_20p{
  font-size : 18px;
  color : yellow;
  background-color : navy;
  font-weight : bold;
  line-height : 180%;
}
@media only screen and (min-width:651px) {
  .yellowbold-navyback_20p{
  font-size : 20px;
  line-height : 200%;
}
}



.whitebold-blueback{
  font-size : 16px;
  color : white;
  background-color : #0000ff;
  font-weight : bold;
  line-height : 180%;
}
@media only screen and (min-width:651px) {
  .whitebold-blueback{
  font-size : 18px;
  line-height : 200%;
}
}

.whitebold-redback{
  font-size : 16px;
  color : white;
  background-color : #ff0000;
  font-weight : bold;
  line-height : 180%;
}
@media only screen and (min-width:651px) {
  .whitebold-redback{
  font-size : 18px;
  line-height : 200%;
}
}

.navy-komoji{
  font-size : 15px;
  font-weight : normal;
  color : navy;
  line-height : 160%;
}
@media only screen and (min-width:651px) {
  .navy-komoji{
  font-weight : normal;
  font-size : 16px;
  color : navy;
  line-height : 180%;
}
}

.komoji-bold{
  font-size : 15px;
  font-weight : bold;
  color : black;
  line-height : 160%;
}
@media only screen and (min-width:651px) {
  .komoji-bold{
  font-size : 16px;
  font-weight : bold;
  color : black;
  line-height : 180%;
}
}


.navy-komoji-b{
  font-size : 15px;
  font-weight : bold;
  color : navy;
  line-height : 160%;
}
@media only screen and (min-width:651px) {
  .navy-komoji-b{
  font-weight : bold;
  font-size : 16px;
  color : navy;
  line-height : 180%;
}
}

.red-komoji-b{
  font-size : 15px;
  font-weight : bold;
  color : red;
  line-height : 160%;
}
@media only screen and (min-width:651px) {
  .red-komoji-b{
  font-weight : bold;
  font-size : 16px;
  color : red;
  line-height : 180%;
}
}

.navy-small{
  font-size : 12px;
  font-weight : normal;
  color : navy;
  line-height : 130%;
}
@media only screen and (min-width:651px) {
  .navy-small{
  font-weight : normal;
  font-size : 14px;
  color : navy;
  line-height : 150%;
}
}

.red-small{
  font-size : 12px;
  font-weight : normal;
  color : red;
  line-height : 130%;
}
@media only screen and (min-width:651px) {
  .red-small{
  font-weight : normal;
  font-size : 14px;
  color : red;
  line-height : 150%;
}
}

.blue_20p{
  font-weight : bold;
  color : blue;
  font-size : 18px;
  line-height : 160%;
}
@media only screen and (min-width:651px) {
  .blue_20p{
  font-size : 20px;
  line-height : 180%;
}
}


.blue_25p{
  font-weight : bold;
  font-size : 18px;
  color : blue;
  line-height : 160%;
}
@media only screen and (min-width:651px) {
  .blue_25p{
  font-size : 25px;
  line-height : 180%;
}
}

.blue_30p{
  font-weight : bold;
  font-size : 20px;
  color : blue;
  line-height : 160%;
}
@media only screen and (min-width:651px) {
  .blue_30p{
  font-size : 30px;
  line-height : 180%;
}
}

.blue_35p{
  font-weight : bold;
  font-size : 25px;
  color : blue;
  line-height : 160%;
}
@media only screen and (min-width:651px) {
  .blue_35p{
  font-size : 35px;
  line-height : 180%;
}
}

.navy_20p{
  font-weight : bold;
  font-size : 18px;
  color : navy;
  line-height : 160%;
}
@media only screen and (min-width:651px) {
  .navy_20p{
  font-size : 20px;
  line-height : 180%;
}
}

.navy_25p{
  font-weight : bold;
  font-size : 18px;
  color : navy;
  line-height : 160%;
}
@media only screen and (min-width:651px) {
  .navy_25p{
  font-size : 25px;
  line-height : 180%;
}
}

.navy_30p{
  font-weight : bold;
  font-size : 20px;
  color : navy;
  line-height : 160%;
}
@media only screen and (min-width:651px) {
  .navy_30p{
  font-size : 30px;
  line-height : 180%;
}
}

.navy_35p{
  font-weight : bold;
  font-size : 25px;
  color : navy;
  line-height : 160%;
}
@media only screen and (min-width:651px) {
  .navy_35p{
  font-size : 35px;
  line-height : 180%;
}
}

.red_20p{
  font-weight : bold;
  font-size : 18px;
  color : red;
  line-height : 160%;
}
@media only screen and (min-width:651px) {
  .red_20p{
  font-size : 20px;
  line-height : 180%;
}
}

.red_25p{
  font-weight : bold;
  font-size : 18px;
  color : red;
  line-height : 160%;
}
@media only screen and (min-width:651px) {
  .red_25p{
  font-size : 25px;
  line-height : 180%;
}
}

.red_30p{
  font-weight : bold;
  font-size : 20px;
  color : red;
  line-height : 160%;
}
@media only screen and (min-width:651px) {
  .red_30p{
  font-size : 30px;
  line-height : 180%;
}
}

.red_35p{
  font-weight : bold;
  font-size : 25px;
  color : red;
  line-height : 160%;
}
@media only screen and (min-width:651px) {
  .red_35p{
  font-size : 35px;
  line-height : 180%;
}
}

.black_30p{
  font-weight : bold;
  font-size : 20px;
  color : black;
  line-height : 160%;
}
@media only screen and (min-width:651px) {
  .black_30p{
  font-size : 30px;
  line-height : 180%;
}
}

.black_35p{
  font-weight : bold;
  font-size : 25px;
  color : black;
  line-height : 160%;
}
@media only screen and (min-width:651px) {
  .black_35p{
  font-size : 35px;
  line-height : 180%;
}
}

.white_25p{
  font-weight : bold;
  font-size : 18px;
  color : white;
  line-height : 160%;
}
@media only screen and (min-width:651px) {
  .white_25p{
  font-size : 25px;
  line-height : 180%;
}
}

.white_30p{
  font-weight : bold;
  font-size : 20px;
  color : white;
  line-height : 160%;
}
@media only screen and (min-width:651px) {
  .white_30p{
  font-size : 30px;
  line-height : 180%;
}
}


.white_35p{
  font-weight : bold;
  font-size : 25px;
  color : white;
  line-height : 160%;
}
@media only screen and (min-width:651px) {
  .white_35p{
  font-size : 35px;
  line-height : 180%;
}
}

a{
  color : blue;
  font-size : 16px;
  font-weight : bold;
  line-height : 180%;
  text-decoration : underline;
}
@media only screen and (min-width:651px) {
  a{
  font-size : 18px;
  line-height : 200%;
}
}

a:hover{
  color : fuchsia;
  text-decoration : underline;
}
.kyouchou{
  font-weight : bold;
  color : blue;
  font-size : 18px;
  line-height : 160%;
}
@media only screen and (min-width:651px) {
  .kyouchou{
  font-size : 20px;
  line-height : 180%;
}
}

.komoji{
  font-size : 15px;
  font-weight : normal;
  color : navy;
  line-height : 160%;
}
@media only screen and (min-width:651px) {
  .komoji{
  font-size : 16px;
  font-weight : bold;
  color : black;
  line-height : 180%;
}
}

.umenu{
  font-size : 15px;
  font-weight : normal;
  color : navy;
  line-height : 180%;
}
@media only screen and (min-width:651px) {
  .umenu{
  font-weight : normal;
  font-size : 16px;
  color : navy;
  line-height : 180%;
}
}

.small{
  font-size : 15px;
  font-weight : normal;
  color : navy;
  line-height : 200%;
}
@media only screen and (min-width:651px) {
  .small{
  font-weight : normal;
  font-size : 16px;
  color : navy;
  line-height : 200%;
}
}

.sub_caption{
  font-weight : bold;
  font-size : 18px;
  color : blue;
  line-height : 160%;
}
@media only screen and (min-width:651px) {
  .sub_caption{
  font-size : 25px;
  line-height : 180%;
}
}

/* ＝＝＝＝＝＝＝＝＝＝＝＝＝　Amazon　リンク　＝＝＝＝＝＝＝＝＝＝＝＝＝ */
.amazon-book{
  float: left;
  width: 120px;
  height: 245px;
  margin: 0px 20px 0px 0;
}
.amazon-link li{
  float: left;
  list-style: none;
  margin: 5px 0;
}
.amazon{
  margin: 0 -5px;
}
@media only screen and (min-width:651px) {
  .amazon{
  margin-left: 25px;
}
}
.amazon::after{
  display: block;
  content: "";
  clear: both;
}
.amazon-single::after{
  display: block;
  content: "";
  clear: both;
}
.amazon-table{
  padding: 10px;
  border: 1px solid;
}

/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝　汎用クラス　＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
/* 縦方向の間隔調整 */
.height-space{
  height: 0px;
  margin-bottom: 40px;
}
/* 小画面－内余白ゼロ */
@media only screen and (max-width:650px) {
  .sm-nopad{
  padding: 0;
}
}

/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝　レイアウトのクラス＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */
p{
  margin: 20px  0px;
}
hr{
  margin: 10px 0px;
}

@media only screen and (min-width:651px) {
  .paradigm{
  padding-left: 30px;
}
}

.zurashi5{
  padding-left: 2em;
}
@media only screen and (min-width:651px) {
  .zurashi5{
  padding-left: 5em;
}
}

.zurashi10{
  padding-left: 4em;
}
@media only screen and (min-width:651px) {
  .zurashi10{
  padding-left: 10em;
}
}

.zurashi15{
  padding-left: 6em;
}
@media only screen and (min-width:651px) {
  .zurashi15{
  padding-left: 15em;
}
}

.zurashi20{
  padding-left: 8em;
}
@media only screen and (min-width:651px) {
  .zurashi20{
  padding-left: 20em;
}
}

.zurashi-L100px{
  padding-right: 50px;
}
@media only screen and (min-width:651px) {
  .zurashi-L100px{
  padding-right: 100px;
}
}

.zurashi100px{
  padding-left: 40px;
}
@media only screen and (min-width:651px) {
  .zurashi100px{
  padding-left: 100px;
}
}

.zurashi200px{
  padding-left: 80px;
}
@media only screen and (min-width:651px) {
  .zurashi200px{
  padding-left: 200px;
}
}

.zurashi300px{
  padding-left: 120px;
}
@media only screen and (min-width:651px) {
  .zurashi300px{
  padding-left: 300px;
}
}

.youtube-4-3{
  width: 320px;
  height: 240px;
}
@media only screen and (min-width:651px) {
  .youtube-4-3{
  width: 480px;
  height: 360px;
}
}
.youtube-4-3-s{
  width: 320px;
  height: 240px;
}
@media only screen and (min-width:651px) {
  .youtube-4-3-s{
  width: 400px;
  height: 300px;
}
}
.youtube-16-9{
  width: 320px;
  height: 180px;
  margin-bottom: 0px;
}
@media only screen and (min-width:651px) {
  .youtube-16-9{
  width: 560px;
  height: 315px;
  margin-bottom: 0px;
}
}
.youtube-16-9-s{
  width: 320px;
  height: 180px;
}
@media only screen and (min-width:651px) {
  .youtube-16-9-s{
  width: 480px;
  height: 270px;
}
}

.video_speed{
  width: 80%;
  margin: 0px 0px 20px 0px;
}
@media only screen and (min-width:651px) {
  .video_speed{
  width: 366px;
  margin: 0px 0px 20px 0px;
}
}

.image_w270{
  width: 50%;
  vertical-align: middle;
  margin: 10px 0;
}
@media only screen and (min-width:651px) {
  .image_w270{
  width: 270px;
  margin: 10px 10px;
}
}


.image_w300{
  width: 50%;
  vertical-align: middle;
  margin: 10px 0;
}
@media only screen and (min-width:651px) {
  .image_w300{
  width: 300px;
  margin: 10px 10px;
}
}

.image-w350{
	width: 100%;
	vertical-align: middle;
      margin: 10px 10px;
}
@media only screen and (min-width:651px) {
	.image-w350{
         width: 350px;
        margin: 20px 10px;
	}
}

.image_w400{
  width: 100%;
  vertical-align: middle;
  margin: 10px 0;
}
@media only screen and (min-width:651px) {
  .image_w400{
  width: 400px;
  margin: 10px 20px;
}
}

.image-w450{
	width: 100%;
	vertical-align: middle;
                margin: 10px 0;
}
@media only screen and (min-width:651px) {
	.image-w450{
        width: 450px;
        margin: 20px 20px;
	}
}

.image-w480{
	width: 100%;
	vertical-align: middle;
                margin: 10px 0;
}
@media only screen and (min-width:651px) {
	.image-w480{
         width: 480px;
         margin: 20px 20px;
	}
}

.image_w500{
  width: 100%;
  vertical-align: middle;
  margin: 10px 0;
}
@media only screen and (min-width:651px) {
  .image_w500{
  width: 500px;
  margin: 20px 20px;
}
}

.image_w600{
  width: 100%;
  vertical-align: middle;
  margin: 10px 0;
}
@media only screen and (min-width:651px) {
  .image_w600{
  width: 600px;
  margin: 20px 20px;
}
}

.point-w660{
	width: 100%;
	vertical-align: middle;
                margin: 10px 0
}
@media only screen and (min-width:651px) {
	.point-w660{
         width: 660px;
        margin: 20px 0
	}
}

.point-w650{
	width: 100%;
	vertical-align: middle;
                margin: 10px 0
}
@media only screen and (min-width:651px) {
	.point-w650{
         width: 650px;
        margin: 20px 0
	}
}

.point-w640{
	width: 100%;
	vertical-align: middle;
                margin: 10px 0
}
@media only screen and (min-width:651px) {
	.point-w640{
         width: 640px;
        margin: 20px 0
	}
}

.point-w630{
	width: 100%;
	vertical-align: middle;
                margin: 10px 0
}
@media only screen and (min-width:651px) {
	.point-w630{
         width: 630px;
        margin: 20px 0
	}
}

.point-w620{
	width: 100%;
	vertical-align: middle;
                margin: 10px 0
}
@media only screen and (min-width:651px) {
	.point-w620{
         width: 620px;
        margin: 20px 0
	}
}

.point-w610{
	width: 100%;
	vertical-align: middle;
                margin: 10px 0
}
@media only screen and (min-width:651px) {
	.point-w610{
         width: 610px;
        margin: 20px 0
	}
}

.point-w600{
	width: 100%;
	vertical-align: middle;
                margin: 10px 0
}
@media only screen and (min-width:651px) {
	.point-w600{
         width: 600px;
        margin: 20px 0
	}
}

.point-w590{
	width: 100%;
	vertical-align: middle;
                margin: 10px 0
}
@media only screen and (min-width:651px) {
	.point-w590{
         width: 590px;
        margin: 20px 0
	}
}
.point-w580{
	width: 100%;
	vertical-align: middle;
                margin: 10px 0
}
@media only screen and (min-width:651px) {
	.point-w580{
         width: 580px;
        margin: 20px 0
	}
}

.point-w570{
	width: 100%;
	vertical-align: middle;
                margin: 10px 0
}
@media only screen and (min-width:651px) {
	.point-w570{
         width: 570px;
        margin: 20px 0
	}
}

.point-w560{
	width: 100%;
	vertical-align: middle;
                margin: 10px 0
}
@media only screen and (min-width:651px) {
	.point-w560{
         width: 560px;
        margin: 20px 0
	}
}

.point-w550{
	width: 100%;
	vertical-align: middle;
                margin: 10px 0
}
@media only screen and (min-width:651px) {
	.point-w550{
         width: 550px;
        margin: 20px 0
	}
}

.point-w540{
	width: 100%;
	vertical-align: middle;
                margin: 10px 0
}
@media only screen and (min-width:651px) {
	.point-w540{
         width: 540px;
        margin: 20px 0
	}
}


.point-w530{
	width: 100%;
	vertical-align: middle;
                margin: 10px 0
}
@media only screen and (min-width:651px) {
	.point-w530{
         width: 530px;
        margin: 20px 0
	}
}

#apple_demo{
  width: 100%;
  vertical-align: middle;
  margin: 10px 0;
}
@media only screen and (min-width:651px) {
  #apple_demo{
  width: 635px;
  margin: 20px 0px;
}
}

#testSamples{
  width: 100%;
  vertical-align: middle;
  margin: 10px 0;
}
@media only screen and (min-width:651px) {
  #testSamples{
  width: 600px;
  margin: 20px auto;
}
}

#suisosui_bottle{
  width: 100%;
  vertical-align: middle;
  margin: 10px 0;
}
@media only screen and (min-width:651px) {
  #suisosui_bottle{
  width: 411px;
  margin: 20px auto;
}
}

#suisosui_bunrui{
  width: 100%;
  vertical-align: middle;
  margin: 10px 0;
}
@media only screen and (min-width:651px) {
  #suisosui_bunrui{
  width: 646px;
  margin: 20px auto;
}
}

.point-w561{
  width: 100%;
  vertical-align: middle;
  margin: 10px 0
;
}
@media only screen and (min-width:651px) {
  .point-w561{
  width: 561px;
  margin: 20px 0
	;
}
}

#hajimeni{
  width: 100%;
  vertical-align: middle;
  margin: 10px 0
;
}
@media only screen and (min-width:651px) {
  #hajimeni{
  width: 610px;
  margin: 20px 0
	;
}
}

#seisuiki_sales_graph{
  width: 100%;
  vertical-align: middle;
}
@media only screen and (min-width:651px) {
  #seisuiki_sales_graph{
  width: 542px;
  margin: 10px auto
	;
}
}

#merry_christmas{
  width: 100%;
  vertical-align: middle;
}
@media only screen and (min-width:651px) {
  #merry_christmas{
  width: 350px;
  margin: 0 auto
	;
}
}

#nenga{
  width: 100%;
  vertical-align: middle;
}
@media only screen and (min-width:651px) {
  #nenga{
  width: 650px;
  margin: 20px auto;
}
}

#equation{
  width: 100%;
  vertical-align: middle;
}
@media only screen and (min-width:651px) {
  #equation{
  width: 421px;
  margin: 10px auto
	;
}
}

#hiketsu_concept{
  width: 100%;
  vertical-align: middle;
}
@media only screen and (min-width:651px) {
  #hiketsu_concept{
  width: 628px;
}
}

#HbA1c_CRP{
  width: 100%;
  vertical-align: middle;
}
@media only screen and (min-width:651px) {
  #HbA1c_CRP{
  width: 600px;
}
}

/* ＝＝＝＝＝＝＝＝＝＝＝＝＝＝　フッター用　＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝ */

footer{
  width: 100%;
  clear: both;
  padding: 15px 20px;
  background: #008;
}
footer ul{
  width: 100%;
  margin-bottom: 30px;
  list-style-type: none;
}
@media only screen and (min-width:651px) {
  footer ul{
  width: 300px;
}
}
footer li{
  width: 50%;
  float: left;
}
footer li a{
  display: block;
  color: #FFF;
  font-size: 13px;
  line-height: 45px;
  padding-left: 10px;
  text-decoration: none;
}
@media only screen and (min-width:651px) {
  footer li a{
  line-height: 24px;
}
}
footer li a:hover{
  background: #0FF;
}
footer ul::after{
  display: table;
  content: "";
  clear: both;
}

#copyright{
  text-align: right;
  color: #FFF;
  font-size: 12px;
}
@media only screen and (min-width:651px) {
  #copyright br{
  display: none;
}
}