/* DOM 対応 Contents のCSS記述　2003年3月20日 作成 */
/* 2005年3月5日@charset：文字コード設定を追加 */
/* HTML5 version に変更（2014/04/25）用に設定 */
/* HTML5 version CSS level2.1 及び media query3 から CSS level3.0 及び media query4 に変更（2021/08/29）用にMedia Query 追加(HpSize0.css)設定 */

@charset "utf-8";
@import url("DOMcomn-Selector.css");
@import url("Fontbase.css");
@import url("BoxMPbase.css");
@import url("BoxWHbase.css");
@import url("BoxBExbase.css");
@import url("Textbase.css");
@import url("Colorbase.css");
@import url("BGCbase.css");
@import url("Table1base.css");
@import url("moveTstyle.css");
@import url("HpSize0.css");
@import url("button-cm.css");

/* 明示的に「Box]の高さをIEと照準なブラウザとの互換性のためCSS3の仕様で統一 */
#ieBox{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;} /* (width/heightにボーダーを含める) */
#regBox{-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box;} /* (width/heightにボーダーを含めないcontent内容領域) */

/* html5 で表示エリア内統一の為新しく追加された要素（7つの要素)について明示的にブロック設定 */
section,article,aside,nav,hgroup,header,footer{display:block;}

th,td{text-align:center;} /* table 要素には「text の 縦、横 の位置」を入れられないため『共通』として設定 2020/07/13  */

/* ---------------------------------------------------------------------------------- */
/* 海の情景案内用の「body」「link：擬似クラス」の設定 */
/* ---------------------------------------------------------------------------------- */

body.explain {color:#000000; background-color:#66cc99;} /* 文字黒  */
body.explainA {color:#000000; background-color:rgba(255,165,000,0.1);} /* 文字黒  */

.explain a:link     {color:#000066;}   
.explain a:visited  {color:#ff0066;}    
.explain a:hover    {color:#990033;}   
.explain a:active   {color:#666666;}    

table.explain {background-image: url("DOMpic/dom01.gif"); background-color:#ffcc99; font-size:medium;
               width:95%;min-width:900px;
               border-width:6px; border-color:transparent;border-style:outset; border-spacing:3px;
               padding:4px;margin-left:auto;margin-right:auto;margin-bottom:0.5em;}

caption.explain {caption-side:top; font-size:larger; font-weight:bold; color:#800000; font-family:Impact,sans-serif}

/* -- seaside1-title1のBody設定／Table. etc -- standerd と 説明付めにゅー切り替え他 -- */
/* -- kaitei-myhome2014/Home-loli/loliServer/index_st/seaside/seaside1/title1.html  -- */

body.explain1 {color:#000000; background-color:#66cc99;}
.explain1 a:link     {color:#000066;}
.explain1 a:visited  {color:#ff0066;}
.explain1 a:hover    {color:#990033;}
.explain1 a:active   {color:#3300FF;}

table.explain1{background-image: url("DOMpic/dom01.gif"); background-color:#ffcc99; font-size:large;
		       width:80%; 
               border-width:6px; border-color:transparent;border-style:outset; border-spacing:3px;
		       padding:4px; position:relative; left:8%; top:3%;}

caption.explain1 {caption-side:top; font-size:larger; font-weight:bold; color:#800000;
		       	  font-family:Impact,sans-serif}

table.explain,table.explain1 img{margin:2px 15px}

/* -- sea_menu.html と seaMenu.html の[table]スタイルの設定に使用[explainM] -- */
/* -- kaitei-myhome2014/Home-loli/loliServer/index_mn/sea_menu/sea_menu.html -- */

table.explainM {background-image: url("DOMpic/dom01.gif");background-color:#ffcc99;font-size:small;
                width:88%;height:90% ;
                border-width:6px;border-color:rgba(128,128,128,0.5);border-style:outset; 
                border-spacing:3px;padding:4px; margin:0 auto;}

table.explainM ul{margin:0;}
/* -- kaitei-myhome2014/Home-loli/oliServer/index_mn/sea_menu/seaMenu.html -- */

table.explainM1 {background-image: url("DOMpic/dom01.gif");background-color:#ffcc99;font-size:small;
                 width:93%; 
                 border-width:6px; border-color:green;border-style:outset; 
                 border-spacing:3px;padding:2px; margin:1% auto;}

/* -----------------------------------------------------------------------------------------*/

/* -- HTML5 version に変更（2014/04/25）用に設定 -- 海の情景案内[iframe]内表示 -- */
/* -- kaitei-myhome2014/Home-loli/oliServer/index_st/seaside/seaside1/sea.html -- */
/* -----------------------------------------------------------------------------------------*/

div.seahome {background-color:#99ccff;border:double #339933 medium ;width:163px;height:15px;
             cursor:pointer;font-size:small;padding:1px; position:relative;top:3px;left:9%;
             text-align:center;}

img.seapic {position:relative;top:3px;left:9%;}
img.seapic1 {margin:3px auto;}

div.movshome {background-color:#99ccff;font-size:small;text-align:center;
              width:163px;height:17px;
              border:double #339933 medium ;cursor:pointer;
              position:relative;top:3px;left:9%;}

/* ---------------------------------------------------------------------------------------- */
/* 湘南の仲間(Pet）案内用の「body」「table 及び内部『li』関連」「link：擬似クラス」の設定 */
/* ---------------------------------------------------------------------------------------- */

body.explain2 {color:#000000; background-color:#ffff99;}
.explain2 a:link     {color:green;} 
.explain2 a:visited  {color:blue;} 
.explain2 a:hover    {color:red;} 
.explain2 a:active   {color:fuchsia;} 

table.explain2       {background-image: url("DOMpic/dom02.jpg"); background-color:#ffcc99; font-size:medium;
                      width:88%;
                      border-width:6px; border-color:#ccff33; border-style:outset; border-spacing:3px;
                      padding:4px; margin:1% auto;}
 thead th{font-size:large;}
table.explain2 ul{margin:0;}

table.explain2 img {margin:2px 15px} 

table.explain2M {background-image: url("DOMpic/back1.gif");background-color:#ffcc99;font-size:small;
                width:88%;height:80% ;
                border-width:6px;border-color:rgba(128,128,128,0.5);border-style:outset; 
                border-spacing:3px;padding:4px; margin:0 auto;}

table.explain2M ul{margin:0;}

/* -- dog_menu.htmlの[table]スタイルの設定に使用[explain2M] -- */
/* -- kaitei-myhome2014/Home-loli/loliServer/index_mn/dog_menu/dog_menu.html -- */
/*
table.explain2M{background-image: url("DOMpic/dom02.jpg");background-color:#ffcc99; font-size:smaller;
                width:95%;
                border-width:6px; border-color:#ccff33; border-style:outset; 
                border-spacing:3px;padding:4px;margin:1.5% auto;}

table.explain2M ul{margin:0;} */

table.explain2MM{background-image: url("DOMpic/back1.gif");background-color:#ffcc99; font-size:smaller;
                width:60%;
                border-width:6px; border-color:#ccff33; border-style:outset; 
                border-spacing:3px;padding:4px;margin-left:3%;margin-top:2%;}
.explain2MM a:link     {color:#ffa500;}
.explain2MM a:visited  {color:#0000ff;}
.explain2MM a:hover    {color:#ff0000;}
.explain2MM a:active   {color:#00ff00;}

body.explain02 {color:#000000; background-color:#ffff99;}
.explain02 a:link     {color:navy;}
.explain02 a:visited  {color:blue;}
.explain02 a:hover    {color:red;}
.explain02 a:active   {color:lime;}

table.explain02 {background-image: url("DOMpic/dom02.jpg"); background-color:#ffcc99; font-size:large;
                 width:95%;
                 border-width:6px; border-color:transparent; border-style:outset;
                 border-spacing:3px; padding:4px; margin:8px auto;}

.tdimcel {font-size:medium;text-align:center;padding:12px;}
.imcelexp {text-align:left;line-height:2em;font-size:smaller;}

#mainblock{width:95%;margin-left:auto;margin-right:auto}
#contmenu{width:18%;height:100%;border:5px ridge #336633;float:left;min-width:150px}
#contentview{width:77%;height:100%;border:5px ridge #336633;float:left;margin-left:2px;}

.videwidth1         {width:600px;}
.videwidth2         {width:500px;}
.videwidth3         {width:400px;}

/* 2005年改造版に使用 */
table.explain21  {background-image: url("DOMpic/dom02.jpg"); background-color:#ffcc99; font-size:medium;
                  width:78%;
                  border-width:6px; border-color:transparent; border-style:outset;
                  border-spacing:3px; padding:4px; margin:1% auto;}

/* thumbNL総合案内版に使用 */

table.explain22  {background-image: url("DOMpic/dom02.jpg"); background-color:#ffcc99; font-size:medium;
                  width:88%;
                  border-width:6px; border-color:transparent; border-style:outset;
                  border-spacing:3px; padding:4px; margin:1% auto;}
                     
caption.explain2 {caption-side:top; font-size:larger; font-weight:bold; 
                  color:Green;font-family:Impact,sans-serif; margin:auto;}

table.explain23 {background-image: url("DOMpic/dom02.jpg");background-color:#ffcc99; font-size:medium;
                 width:95%;
                 border-width:6px; border-color:transparent; border-style:outset;
                 border-spacing:3px; padding:4px; position:relative; left:2%; top:3%;}

/* --  HTML5 version に変更（2014/04/25）用に設定 -- 湘南の仲間と情報案内[iframe]内表示 -- */
/* -- kaitei-myhome2014/Home-loli/loliServer/index_st/dog_all/dog_all1/dog.html         -- */
/* --------------------------------------------------------------------------------------- */

div.doghome {background-color:#99ccff;border:double #ffcc99 medium ;font-size:small;text-align:center;
             width:163px;height:15px;
             cursor:pointer; padding:1px; position:relative;top:3px;left:9%;}

img.dogpic {position:relative;top:3px;left:9%;}

div.movdhome {background-color:#99ccff;border:double #ffcc99 medium ;font-size:small; text-align:center;
              width:163px;height:17px;
              cursor:pointer;position:relative;top:3px;left:9%; }
  
/* ------------------------------------------------------------------------------------- */
/* My Favorit 案内用の「body」「table 及び内部『li』関連」「link：擬似クラス」の設定 */
/* ------------------------------------------------------------------------------------- */

body.explain3 {color:#000000; background-color:rgba(173,255,047,0.3);}
body.explain32 {color:#000000; background-color:rgba(102,204,153,0.8);}
.explain3,.explain32 a:link     {color:#000066;}
.explain3,.explain32 a:visited  {color:#ff0066;}
.explain3,.explain32 a:hover    {color:#990033;}
.explain3,.explain32 a:active   {color:#666666;}

table.explain3 {background-image: url("DOMpic/back1.gif"); background-color:#ffcc99;font-size:medium;
                width:95%;
                border-width:6px; border-color:transparent; border-style:outset; 
                border-spacing:3px; padding:4px; margin:1% auto;}

table.explain3 img {margin:2px 15px}
table.explain3 ul{margin:0;}
/* -- fav_menu.htmlの[table]スタイルの設定に使用[explain3M] -- */
/* -- kaitei-myhome2014/Home-loli/loliServer/index_mn/fav_menu/fav_menu.html -- */

table.explain3M {background-image: url("DOMpic/back1.gif"); background-color:#ffcc99;font-size:small;
                 width:95%; 
                 border-width:6px; border-color:rgba(128,128,128,0.5);border-style:outset;
                 border-spacing:3px; padding:4px; position:relative; left:1.5%; top:1.5%;}

table.explain3M3 {background-image: url("DOMpic/back1.gif");background-color:#ffcc99;font-size:small;
                width:88%;height:90% ;
                border-width:6px;border-color:rgba(128,128,128,0.5);border-style:outset; 
                border-spacing:3px;padding:4px; margin:0 auto;}

table.explain3M3 ul{margin:0;}


caption.explain3 {caption-side:top; font-size:larger; font-weight:bold; color:#cc0033;font-family:Impact,sans-serif;}

/* -- HTML5 version に変更（2014/04/25）用に設定 -- 釣り状況案内[iframe]内表示 --*/
/* -- kaitei-myhome2014/Home-loli/loliServer/index_st/favorits/favorit1/curry01.html -- */
/* ---------------------------------------------------------------------------------------- */

div.favhome {background-color:#99ccff;border:double #339933 medium ;font-size:small; text-align:center;
             width:163px;height:15px;
             cursor:pointer;padding:1px; position:relative;top:3px;left:9%;}

img.favpic {position:relative;top:3px;left:9%;}

div.movfhome{background-color:#99ccff; font-size:small; text-align:center;
             width:163px;height:17px;
             border:double #339933 medium ;
             cursor:pointer; position:relative;top:3px;left:9%;}

/* 2005年改造版に使用 */
/* --------------------------------------------- */
 
table.explain31 {background-image: url("DOMpic/back1.gif");background-color:#ffcc99; font-size:medium;
                 width:77%;
                 border-width:6px;border-color:transparent; border-style:outset;
                 border-spacing:3px;padding:4px; margin:0.5% auto;}

 /* 個別拡大画像表示枠付き */
table.explain31a {background-image: url("DOMpic/back1.gif");background-color:#ffcc99;font-size:medium;
                  width:75%;
                  border-width:6px; border-color:transparent; border-style:outset;
                 border-spacing:3px; padding:4px; margin:0.5% auto;}

table.explain31b {background-image: url("DOMpic/back1.gif");background-color:#ffcc99; font-size:medium;
                  width:68%;
                  border-width:6px; border-color:transparent; border-style:outset;
                  border-spacing:3px;padding:4px; margin:auto;}

table.explain33 {background-image: url("DOMpic/back1.gif");background-color:#ffcc99; font-size:medium;
                 width:95%;
                 border-width:6px; border-color:transparent;border-style:outset;
                 border-spacing:3px;padding:4px; position:relative; margin:0.5% auto;}

/* -------------------------------------------------------------------------------------- */

.plink  {font-size: smaller;}

.title0 {color:maroon; text-align:center; background-color:#33ffcc;
         width:35%;
         position:relative; left:32.5%; border:outset 6px; padding:3px;}

.title1 {color:maroon; text-align:center; background-color:#33ff99;
         width:35%;
         position:relative; left:32.5%; border:outset 6px; padding:3px;}

.title2 {color:maroon; text-align:center; background-color:#66cc99;
         width:35%;
         position:relative; left:32.5%; border:outset 6px; padding:3px;}

colgroup.koumoku {background-image: url("DOMpic/dom5.jpg");}

div.framemenu    {background-color:#99ccff; border:#339933 inset 5px;
                  width:140px;
                  cursor:pointer;margin-top:6px; padding:3px;}

/* ------------------------------------------------------------------------------------- */
/* スライドウインドウのアクション（一時停止（1）、ホーム（2）、閉じる（3））*/
/* ------------------------------------------------------------------------------------- */

div.slideaction1 {border:5px outset green; text-align:center;
                  width:150px;                  
                  position:relative; left:7.0%; top:1%; margin:6px; float:left;}

div.slideaction2 {border:5px outset blue; text-align:center;
                  width:180px;
		          position:relative; left:7.0%; top:1%; margin:6px; float:left;}

div.slideaction3 {border:5px outset green; text-align:center;
                  width:100px;
		          position:relative; left:7.0%; top:1%; margin:6px; float:left;}

/* -------------------------------------------------------------------------------------------- */
/* サムネイルアルバム（***ALB.html）のリンク用ボックス「無番号：海用」2:湘南の仲間3:好きなもの */
/* -------------------------------------------------------------------------------------------- */

div.albumreturn     {border:2px inset; background-color:#66cc99; width:90%; margin:3px auto; padding:2px;}

div.albumreturn2    {border:2px inset; background-color:#ffff99; width:90%; margin:3px auto; padding:2px;}

div.albumreturn3    {border:2px inset; background-color:#00cc99; width:90%; margin:7px auto; padding:5px;}

/* ------------------------------------------------------------------------------------------- */
/* サムネイル画面　スライドショー　ボタン用　*/
/* ------------------------------------------------------------------------------------------- */

div.slideshow {border:4px outset; font-weight:bold; text-align:center; text-decoration:none;
               width:680px;
               margin:4px auto; padding:2px; cursor:pointer;}

/* ------------------------------------------------------------------------------------------- */
/* メインメニュー上下テーブル間のリンクボタン全体を包むボックス[seaMenu]使用 */
/* ------------------------------------------------------------------------------------------- */

div.mainmenuMid {border:4px outset;padding:2px;margin-top:5px;margin-bottom:5px;width:80%;
                 position:relative;top:1.4%;left:10%;text-align:center;font-size:smaller;}

/* ------------------------------------------------------------------------------------------- */
/* 画面左右側のボタン用 [seaMenu]使用 */
/* ------------------------------------------------------------------------------------------- */

.mainmenu1 {border:2px groove red; cursor:pointer;
            position:relative; left:6%; margin:1px; padding:1px; float:left;}

/* ------------------------------------------------------------------------------------------- */
/* 画面中央のボタン用  */
/* ------------------------------------------------------------------------------------------- */

.mainmenu2 {border:2px groove; cursor:default; float:left; 
            position:relative;left:6%; margin:1px 8px; padding:1px;}

/* ------------------------------------------------------------------------------------------- */
/* メインメニュー上テーブル上部のリンクボタン全体を包むボックス */
/* ------------------------------------------------------------------------------------------- */

div.mainmenuTop     {border:4px inset; font-size:smaller; text-align:center; line-height:1.4em;
                     width:80%;
                     position:relative; top:1%; left:10%; margin-top:0.5em; margin-bottom:0.7em; padding:2px;}

div.mainmenuT1      {border:2px ridge red; font-size:small; cursor:pointer; margin:1px; padding:1px; float:left;}

div.mainmenuT2      {border:2px ridge; padding:1px;margin;1px 8px; cursor:default; float:left; }

/* ------------------------------------------------------------------------------------------- */
/* 全画面共通のリスト項目 ( li で 個別化 又は ul,ol で その内容を表示する li に 継承させる) */
/* ------------------------------------------------------------------------------------------- */

.hanablue	    {list-style-image: url("DOMpic/hanablue.gif"); list-style-position:outside;}
.hanablue5	    {list-style-image: url("DOMpic/hanablue.gif"); list-style-position:outside;margin:5px 2px 5px 0;}
.hanablue7	    {list-style-image: url("DOMpic/hanablue.gif"); list-style-position:outside;margin:7px 2px 5px 0;}

.hana2blu	    {list-style-image: url("DOMpic/hana2blu.gif"); list-style-position:outside;}
.hana2blu5	    {list-style-image: url("DOMpic/hana2blu.gif"); list-style-position:outside;margin:5px 2px 5px 0;}
.hana2blu7	    {list-style-image: url("DOMpic/hana2blu.gif"); list-style-position:outside;margin:7px 2px 5px 0;}

.hanared	    {list-style-image: url("DOMpic/hanared.gif"); list-style-position:outside;}
.hanared5	    {list-style-image: url("DOMpic/hanared.gif"); list-style-position:outside;margin:5px 2px 5px 0;}
.hanared7	    {list-style-image: url("DOMpic/hanared.gif"); list-style-position:outside;margin:7px 2px 5px 0;}

.hana2red	    {list-style-image: url("DOMpic/hana2red.gif"); list-style-position:outside;}
.hana2red5	    {list-style-image: url("DOMpic/hana2red.gif"); list-style-position:outside;margin:5px 2px 5px 0;}
.hana2red7	    {list-style-image: url("DOMpic/hana2red.gif"); list-style-position:outside;margin:7px 2px 5px 0;}

.hanagren	    {list-style-image: url("DOMpic/hanagren.gif"); list-style-position:outside;}
.hanagren5	    {list-style-image: url("DOMpic/hanagren.gif"); list-style-position:outside;margin:5px 2px 5px 0;}
.hanagren7	    {list-style-image: url("DOMpic/hanagren.gif"); list-style-position:outside;margin:7px 2px 5px 0;}

.hana2gre	    {list-style-image: url("DOMpic/hana2gre.gif"); list-style-position:outside;}
.hana2gre5	    {list-style-image: url("DOMpic/hana2gre.gif"); list-style-position:outside;margin:5px 2px 5px 0;}
.hana2gre7	    {list-style-image: url("DOMpic/hana2gre.gif"); list-style-position:outside;margin:7px 2px 5px 0;}

.hanapink	    {list-style-image: url("DOMpic/hanapink.gif"); list-style-position:outside;}
.hanapink5	    {list-style-image: url("DOMpic/hanapink.gif"); list-style-position:outside;margin:5px 2px 5px 0;}
.hanapink7	    {list-style-image: url("DOMpic/hanapink.gif"); list-style-position:outside;margin:7px 2px 5px 0;}

.hana2pin	    {list-style-image: url("DOMpic/hana2pin.gif"); list-style-position:outside;}
.hana2pin5	    {list-style-image: url("DOMpic/hana2pin.gif"); list-style-position:outside;margin:5px 2px 5px 0;}
.hana2pin7	    {list-style-image: url("DOMpic/hana2pin.gif"); list-style-position:outside;margin:7px 2px 5px 0;}

.hanalime	    {list-style-image: url("DOMpic/hanalime.gif"); list-style-position:outside;}
.hanalime5	    {list-style-image: url("DOMpic/hanalime.gif"); list-style-position:outside;margin:5px 2px 5px 0;}
.hanalime7	    {list-style-image: url("DOMpic/hanalime.gif"); list-style-position:outside;margin:7px 2px 5px 0;}

.hana2lim	    {list-style-image: url("DOMpic/hana2lim.gif"); list-style-position:outside;}
.hana2lim5	    {list-style-image: url("DOMpic/hana2lim.gif"); list-style-position:outside;margin:5px 2px 5px 0;}
.hana2lim7	    {list-style-image: url("DOMpic/hana2lim.gif"); list-style-position:outside;margin:7px 2px 5px 0;}

.star		    {list-style-image: url("DOMpic/star.gif"); list-style-position:outside;}
/* ---------------------------------リスト内の枠と文字のパッデング------------------------------------------- */
.hanapad5{padding:5px 0;} .hanapad7{padding:7px 0;} .hanapad10{padding:10px 0;}

.bgimN{background-image:none;}
/* ---------------------------------ボックスの位置 と ボックスの位置間の距離------------------------------------------- */

 h2,h3,table ~ div{margin-top:15px;margin-bottom:15px;}   /* 要素 h2 h3 table より後に登場する 兄弟要素 div */
   div + div{margin-top:20px;margin-bottom:20px;}  /* 要素 div 直後に登場する 兄弟要素 div */  
   
   div div{margin-top:20px;margin-bottom:20px;}   /* 要素 div の子孫として登場する 要素 div */

/* -------------------------------------------------------------------------------------------- */