/*===============================================
●style.css 画面の横幅が769px以上
===============================================*/
@charset='utf-8';

@media screen and (min-width: 769px){
img{
max-width: 100%;
height: auto;
width /***/:auto;　
}
#container{
width:100%;
}
/*
～以下、画面の横幅が768pxまでの場合のスタイル記入～
*/


}

/*以下すべて共通*/
/*文字サイズ*/
body {
font-family: Osaka,"ＭＳ Ｐゴシック","MS PGothic",Sans-Serif;
}

select {
font-family: Osaka,"ＭＳ Ｐゴシック","MS PGothic",Sans-Serif;
}
/*表の操作　td幅 表の内の文字中央揃え*/
td {
padding: 3px 10px;
text-align: center;
}

td.left {
padding: 3px 10px;
text-align: left;
}
/*
td {
padding-right: 10px;
padding-left: 10px;
text-align: center;
}
*/
/*表の色塗り*/
td.col0 {
background: #008000;
color: #ffffff;
}
.col1 {
background: #ff8c00;
}
.col2 {
background-color: #00ffff;
}
.col3 {
background: #ffc0cb;
}
.col4 {
background: #800080;
color: #ffffff;
}
.col5 {
background: #808080;
color: #ffffff;
}
.col6 {
background: #00ff00;
}
.col7 {
background: #800000;
color: #ffffff;
}
.col8 {
background: #ffff00;
}
.col9 {
background: #ff1493;
}

.hami {
width: 150px;
height: 18px;
overflow: hidden;
}


/* MARQUEE */
/*
.marquee p {
margin:0;
padding-left:100%; //アニメーションの範囲
display:inline-block; 
white-space:nowrap;
animation-name:marquee; //アニメーションのクラス名
animation-timing-function:linear;//アニメーションのタイミング・進行割合の指定
animation-duration:12s; //アニメーションの速度
animation-iteration-count:infinite;//アニメーションの動作回数
}
@keyframes marquee {//動作範囲(上級者向けの設定)
from   { transform: translate(0%);} 
99%,to { transform: translate(-100%);}
}
*/

.marquee {
    max-width: 100%;
    padding: 1em 0;
    margin: 0 auto;
    position: relative;
    overflow: hidden;
    text-align: left;
    border-top: 1px solid #000000;
    border-bottom: 1px solid #000000;
    color: #ff0000;
    font-weight: bold;
}
.marquee p:after {
    content:"";
    white-space:nowrap;
    padding-right:50px;
}
.marquee p {
    margin:0;
    padding-left:100%;
    display:inline-block;
    white-space:nowrap;
    -webkit-animation-name:marquee;
-webkit-animation-timing-function:linear;
-webkit-animation-duration:10s;
-webkit-animation-iteration-count:infinite;
-moz-animation-name:marquee;
-moz-animation-timing-function:linear;
-moz-animation-duration:10s;
-moz-animation-iteration-count:infinite;
-ms-animation-name:marquee;
-ms-animation-timing-function:linear;
-ms-animation-duration:10s;
-ms-animation-iteration-count:infinite;
-o-animation-name:marquee;
-o-animation-timing-function:linear;
-o-animation-duration:10s;
-o-animation-iteration-count:infinite;
animation-name:marquee;
animation-timing-function:linear;
animation-duration:10s;
animation-iteration-count:infinite;
}
@-webkit-keyframes marquee {
    from   { -webkit-transform: translate(0%);}
    99%,to { -webkit-transform: translate(-100%);}
}
@-moz-keyframes marquee {
    from   { -moz-transform: translate(0%);}
    99%,to { -moz-transform: translate(-100%);}
}
@-ms-keyframes marquee {
    from   { -ms-transform: translate(0%);}
    99%,to { -ms-transform: translate(-100%);}
}
@-o-keyframes marquee {
    from   { -o-transform: translate(0%);}
    99%,to { -o-transform: translate(-100%);}
}
@keyframes marquee {
    from   { transform: translate(0%);}
    99%,to { transform: translate(-100%);}
}

/*リンクボタン風*/
.btn1 a {
  display: flex;
	justify-content: center;
	align-items: center;
	position: relative;
	width: 300px;
	height: 100px;
	color: #ffffff;
	font-size: 30px;
	font-weight: 700;
	text-decoration: none;
        background-color: #14d927;

        border-radius: 20px;
}

.btn2 a {
  display: flex;
	justify-content: center;
	align-items: center;
	position: relative;
	width: 300px;
	height: 100px;
	color: #ffffff;
	font-size: 30px;
	font-weight: 700;
	text-decoration: none;
        background-color: #dda0dd;

        border-radius: 20px;
}

.btn3 a {
  display: flex;
	justify-content: center;
	align-items: center;
	position: relative;
	width: 300px;
	height: 100px;
	color: #ffffff;
	font-size: 30px;
	font-weight: 700;
	text-decoration: none;
        background-color: #ff8c00;

        border-radius: 20px;
}

.btn4 a {
  display: flex;
	justify-content: center;
	align-items: center;
	position: relative;
	width: 300px;
	height: 100px;
	color: #ffffff;
	font-size: 30px;
	font-weight: 700;
	text-decoration: none;
        background-color: #0000ff;

        border-radius: 20px;
}