@charset "utf-8";
@media screen and (min-width : 0px ){
/*各サイズ共通の装飾*/

body{ background-color: #ffffcc; }



/*文字サイズ*/
h1 { color:blue; }
h1 { font-size:35px; }
h2 { font-size:18px; }
p { font-size:13px; }
li { font-size:13px; }

.oomoji { font-size:15px; }




a { text-decoration:none; }

.table02 {
	position: fixed ;
	bottom: 0;
	left: 0;
	width: 100%;
}

.img01{
	margin: 0;
	padding: 0;
	vertical-align: bottom;
	width: 100%;
}

.table03 {
        width: 60%;
}
.img02{
	width: 100%;
}

/*ショートカットのサイズ切り替え調整*/
.shortcut{
display: none;
}
.shortcut2{
display: none;
}
.shortcut3{
display: inline;
}



/*ショートカット（スマホ用）*/
.shortcut3 table{
width:100%;
height:50px;
text-align:center;
border-collapse:collapse;
border:3px solid aliceblue;
background-color: lightsteelblue;
}
.shortcut3 table td{
font-size:7px;
padding:10px 3px;
border:solid 2px aliceblue;
}
.shortcut3 a{
color:black;
}

/*各区画の装飾*/

.whole table tr{
valign:top;
}

.whole{
width:100%;
}
.whole td{
display: block;
width:100%;
}


/*お問い合わせボタン配置の切り替え調整*/
.tel{ display:none; 
}
.tel2{ display:inline;
}



/*詳細はこちらボタンの装飾（スマホ）*/
.btn-purple,
a.btn-purple{
font-size:18px;
color:#fff;
width:300px;
height:100px;
background-color:#b384ff;
padding:6px 8px;
}
.btn-purple:hover,
a.btn-purple:hover{
color:#fff;
background:#dcc2ff;
}





}
/*ここまでスマホサイズ*/


/*ここからタブレットサイズ*/
@media screen and (min-width : 768px ){

/*文字サイズ*/
h1 { font-size:40px; }
h2 { font-size:20px; }
p { font-size:16px; }
li { font-size:16px; }

.oomoji { font-size:18px; }



.table01 {
	position: fixed ;
	top: 0;
	right: 0;
	width: 20%
}

.img01{
	margin: 0;
	padding: 0;
	vertical-align: bottom;
	width: 100%;
}

.table03 {
	width: 50%;
}
.img02{
	width: 100%;
}

/*ショートカットのサイズ切り替え調整*/
.shortcut{
display:none;
}
.shortcut2{
display:inline;
}
.shortcut3{
display:none;
}

/*ショートカット（タブレット用の装飾）*/
.shortcut2 table{
width:85%;
height:50px;
text-align:center;
border-collapse:collapse;
border:2px solid aliceblue;
background-color: lightsteelblue;
}
.shortcut2 table td{
font-size:14px;
padding:10px 2px;
border:solid 2px aliceblue;
}
.shortcut2 a{
color:black;
}




/*お問い合わせボタンの配置切り替え調整*/
.tel{ display: block; 
}
.tel2{ display: none;
}


/*各区画の調整*/
.whole{
width:100%;
}

.whole td{
display: table-cell;
width:50%;
}

/*詳細はこちらボタンの装飾（タブレット、パソコン共通）*/
.btn-purple,
a.btn-purple{
font-size:22px;
color:#fff;
width:300px;
height:100px;
background-color:#b384ff;
padding:6px 8px;
}
.btn-purple:hover,
a.btn-purple:hover{
color:#fff;
background:#dcc2ff;
}


}/*ここまでタブレットサイズ*/


/*ここからパソコンサイズ*/
@media screen and (min-width : 960px ){


/*文字サイズ*/
h1 { font-size:70px; }
h2 { font-size:25px; }
p { font-size:22px; }
li { font-size:22px; }

.oomoji { font-size:26px; }

/*ショートカットのサイズ切り替え調整*/

.shortcut{
display: inline;
}
.shortcut2{
display: none;
}
.shortcut3{
display: none;
}

/*ショートカット（パソコン用の装飾）*/

.shortcut table{
width:85%;
height:50px;
text-align:center;
border-collapse:collapse;
border:3px solid aliceblue;
background-color: lightsteelblue;
}
.shortcut table td{
font-size:17px;
padding:10px 4px;
border:solid 2px aliceblue;
}
.shortcut a{
color:black;
}





}/*ここまでパソコンサイズ*/