/* ====================================================
* ELEMENT ---
html, wrap, body, h1, h2
* ===================================================*/
/*wrapの指定*/
wrap {
background: #ffffff; /*背景色の指定*/
display: inline-block; /*高さ、横幅を指定可能なボックス*/
margin: auto; /*外側の隙間を指定 上:0px, 右:0px, 下:0px, 左:0px*/
position: relative; /*要素の位置 relativeはabusolute, center, page, fixedには影響与えず*/
width: 950px /*幅の指定*/
}
/*bodyの指定*/
body {
color: #333333; /*テキストの色*/
font-size: 16pt; /*テキストのフォントサイズ*/
font-family: "ヒラギノ丸ゴ ProN W4", "メイリオ", sans-serif; /*フォントファミリの指定*/
text-align: center; /*テキストの配置*/
letter-spacing: 2pt; /*テキストの文字間隔*/
margin: 0px; /*外側の隙間を指定 上:0px, 右:0px, 下:0px, 左:0px*/
padding: 0px; /*内側の隙間を指定 上:0px, 右:0px, 下:0px, 左:0px*/
background-color: #ffffff; /*背景色の指定*/
}
/*フォント統一*/
h1, h2, h3, ul, li {
margin: 1px; /*外側の隙間を指定 上:1px, 右:1px, 下:1px, 左:1px*/
padding: 1px; /*内側の隙間を指定 上:1px, 右:1px, 下:1px, 左:1px*/
}
/*h1*/
h1 {
background-color: #ffffff; /*背景色の指定*/
border: 1px solid #999999; /*枠の指定*/
font-size: 12pt; /*テキストのフォントサイズ*/
color: #333366; /*テキストの色*/
margin: 0px 0px 8px 0px; /*外側の隙間を指定 上:0px, 右:0px, 下:0px, 左:0px*/
padding: 5px 3px 3px 5px; /*内側の隙間を指定 左から、上、右、下、左*/
}
/*要素のスタイル無し*/
ul {
list-style: none; /*リストのスタイル*/
}
/*画像の設定*/
img {
border: none; /*枠線なし*/
}
/*リンクの表示*/
a:link {
color: #0044cc;
}
a:visited {
color: #000066;
}
a:link:hover {
color: #ff0000;
}
a:visited:hover {
color: #ff0000;
}
/* ====================================================
* CLASS # ---
Title, Menu, Main, Footer
* ===================================================*/
/*Headerの指定*/
#Header {
position: relative;
width: 950px;
height: 450px;
margin: 0px 0px 0px 0px; /*外側の隙間を指定 上:0px, 右:0px, 下:0px, 左:0px*/
padding: 0px 0px 0px 0px; /*内側の隙間を指定 上:0px, 右:0px, 下:0px, 左:0px*/
}
#Header h1 {
font-size: 24pt; /*テキストのフォントサイズ*/
color: #333366; /*テキストの色*/
text-align: left; /*テキストの配置*/
}
#Header maImg {
width: 950px;
height: 450px;
margin: 0px; /*外側の隙間を指定 上:0px, 右:0px, 下:0px, 左:0px*/
padding: 0px; /*内側の隙間を指定 上:0px, 右:0px, 下:0px, 左:0px*/
}
/*Mainの指定*/
#Main {
position: relative;
width: 896px;
height: 470px;
text-align: left; /*テキストの配置*/
margin: 0px 1px 0px 1px; /*外側の隙間を指定 上:0px, 右:1px, 下:0px, 左:1px*/
padding: 20px 0px 20px 34px; /*内側の隙間を指定 上:20px, 右:0px, 下:20px, 左:34px*/
background-color: #ffffff; /*Mainの背景色の指定*/
}
/*Main内の文字間隔などの調整*/
#Main p {
line-height: 1px;
text-indent: 1em;
letter-spacing: 0.2em;
}
/*Main2の指定*/
#Main2 {
position: relative;
width: 934px;
height: 244px;
text-align: left; /*テキストの配置*/
margin: 0px 1px 0px 1px; /*外側の隙間を指定 上:0px, 右:1px, 下:0px, 左:1px*/
padding: 20px 0px 20px 16px; /*内側の隙間を指定 上:20px, 右:0px, 下:20px, 左:16px*/
background-color: #ffffff; /*Menuの背景色の指定*/
}
#Main2 ul {
margin: 0px 0px 0px 5px; /*外側の隙間を指定 上:0px, 右:0px, 下:0px, 左:5px*/
}
#Main2 ul li {
display: inline-block;
min-height: 0px;
float: left;
margin: 0px 0px 0px 13px; /*外側の隙間を指定 上:0px, 右:0px, 下:0px, 左:13px*/
padding: 0px 0px 0px 0px; /*内側の隙間を指定 上:0px, 右:0px, 下:0px, 左:0px*/
}
/*Menuの指定*/
#Menu {
position: relative;
display: block;
width: 950px;
height: 43px;
text-align: center; /*テキストの配置*/
margin: 20px 0px 0px 0px; /*外側の隙間を指定 上:20px, 右:0px, 下:0px, 左:0px*/
padding: 8px 0px 9px 0px; /*内側の隙間を指定 上:8px, 右:0px, 下:9px, 左:0px*/
background-color: #ffffff; /*Menuの背景色の指定*/
border-top: 3px solid #000000; /*上の枠線*/
border-bottom: 3px solid #000000; /*下の枠線*/
}
#Menu h1 {
font-size: 12pt; /*テキストのフォントサイズ*/
color: #000000; /*テキストの色*/
text-align: center; /*テキストの配置*/
}
#Menu ul {
width: 930px;
margin: 0px 0px 0px 17px; /*外側の隙間を指定 上:0px, 右:0px, 下:0px, 左:17px*/
}
#Menu ul li {
display: inline-block;
min-height: 0px;
float: left;
margin: 0px 0px 0px 23px; /*外側の隙間を指定 上:0px, 右:0px, 下:0px, 左:23px*/
padding: 0px 0px 0px 0px; /*内側の隙間を指定 上:0px, 右:0px, 下:0px, 左:0px*/
}
/*Footerの設定*/
#Footer {
position: relative;
font-size: 16px; /*テキストのフォントサイズ*/
color: #000000; /*テキストの色*/
text-align: center; /*テキストの配置*/
clear: both; /*floatで設定したテキストの回り込みの解除*/
width: 100%; /*幅の指定*/
margin: 0px 0px 0px 5px; /*外側の隙間を指定 上:0px, 右:0px, 下:0px, 左:5px*/
padding: 15px 0px 0px 5px; /*内側の隙間を指定 上:15px, 右:0px, 下:0px, 左:5px*/
}
/* ====================================================
* id . ---
* ===================================================*/
.column01, .column02, .column03 {
float: left;
margin: 0px 0px 0px 20px; /*外側の隙間を指定 上:0px, 右:0px, 下:0px, 左:20px*/
background-color: #ffffff; /*Menuの背景色の指定*/
}
.column01 {
width: 280px;
height: 470px;
border: 0px solid #999;
border-bottom: 0 none;
}
.column02 {
width: 280px;
height: 470px;
}
.column01.first-child {
margin-left: 0;
}
.column01 .section-lv2, .column02 .section-lv2 {
margin: 0px 0px 0px 0px; /*外側の隙間を指定 上:0px, 右:0px, 下:0px, 左:0px*/
}
/* ++special-contents */
#special-contents {
margin-bottom: 0;
margin: 0px 0px 0px 0px; /*外側の隙間を指定 上:0px, 右:0px, 下:0px, 左:0px*/
padding: 0px 0px 20px 0px; /*内側の隙間を指定 上:0px, 右:0px, 下:20px, 左:0px*/
border: 0px solid #999;
}
/* ++event */
#event {
height: 225px;
margin: 0px 0px 0px 0px; /*外側の隙間を指定 上:0px, 右:0px, 下:0px, 左:0px*/
padding: 0px 0px 20px 0px; /*内側の隙間を指定 上:0px, 右:0px, 下:0px, 左:0px*/
text-align: center;
}
.column01 h2, .column02 h2 {
margin: 5px 0px 5px 5px; /*外側の隙間を指定 上:5px, 右:0px, 下:5px, 左:5px*/
}
.section-lv2 ul {
height: 90px;
margin: 0px 0px 0px 15px; /*外側の隙間を指定 上:0px, 右:0px, 下:0px, 左:15px*/
}
.section-lv2 ul li {
min-height: 0px;
float: left;
margin: 0px 13px 1px 0px; /*外側の隙間を指定 上:0px, 右:13px, 下:1px, 左:0px*/
padding: 0px 13px 1px 0px; /*内側の隙間を指定 上:0px, 右:13px, 下:1px, 左:0px*/
}
#eyeCatch {
width: 100%;
height: auto;
background-color: rgba(0,0,0,0.5);
position: fixed;
top: 0;
left: 0;
margin: 0 auto;
padding: 3% 0 30%;
}
.column01 {
background: url(../img/top/ikimono_button1_on.jpg) 0 0 no-repeat;
}
.column01 a:hover {
opacity: 0;
transition: 0.2s;
}
.column02 {
background: url(../img/top/photokon_button1_on.jpg) 0 0 no-repeat;
}
.column02 a:hover {
opacity: 0;
transition: 0.2s;
}
#special-contents {
background: url(../img/top/tayousei_button1_on.gif) 0 0 no-repeat;
}
#special-contents a:hover {
opacity: 0;
transition: 0.2s;
}
#event {
background: url(../img/top/top_button_matome2020on.gif) 0 0 no-repeat;
}
#event a:hover {
opacity: 0;
transition: 0.2s;
}