/* http://meyerweb.com/eric/tools/css/reset/ 
v2.0 | 20110126
License: none (public domain)
*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
display: block;
}
body {
line-height: 1;
}
ol, ul {
list-style: none;
}
blockquote, q {
quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
content: '';
content: none;
}
table {
border-collapse: collapse;
border-spacing: 0;
}



html {
    font-size: 62.5%; /*フォントの基準サイズを10pxにする*/
}

body {
    font-size: 1.7rem; /*全体のフォントサイズは14pxとする*/
    line-height: 1.5; /*全体の行の高さは文字の1.5(倍)とする*/
    text-align: justify; /*行末を揃える*/
    -webkit-text-size-adjust: 100%; /*スマホでPC表示した際に勝手に文字が大きくなるのを防ぐ*/
}

body * {
    box-sizing: border-box; /*paddingやborderの大きさもwidthとheightに含める*/
    background-repeat: no-repeat; /*背景は基本的にリピートしない*/
}

img {
	border: 0;/*-リンクした場合の線を無くす*/
    display: block; /*デフォルトのdisplay:inline;で表示することはほぼ無いため*/
    max-width: 100%; /*親要素の幅からはみ出させない*/
    height: auto; /*一括指定(以降imgの大きさはwidthのみ指定すればよい)*/
}

a {
    display: block; /*デフォルトのdisplay:inline;で表示することが少ないため(ボタンなど)*/
    text-decoration: none; /*装飾は一切つけない*/
    color: inherit; /*親要素に指定した色を受け継ぐ*/
}

a:hover {
    opacity: .8; /*マウスオーバー時の透明度を指定*/
}

p a {
    display: inline; /*pタグ内のリンクは文字列として表示する*/
    color: #00f; /*カラーを指定*/
    text-decoration: underline; /*下線をつける*/
}

p a:hover {
    text-decoration: none; /*マウスオーバー時下線を消す*/
}

small {
    display: block; /*改行して表示することが多いため*/
    font-size: 1rem; /*全体に指定したフォントサイズより小さい値を指定*/
}

#wrap {
    width: 100%; /*全ての要素を包括する<div id"wrap">の幅を画面幅に設定する*/
    overflow-x: hidden; /*横にはみ出した部分は表示させない（スクロールさせない）*/
}

.inner {
    width: 1000px; /*インナーの幅を指定*/
    position: relative; /*本来配置される位置を基準とする*/
    left: 50%; /*親要素の幅の半分右にずらす*/
    margin: 0 0 0 -500px; /*この要素の半分左にずらす*/
}

.fl {
    float: left; /*class="fl"と指定するだけで左に回り込ませる*/
}

.fr {
    float: right; /*class="fr"と指定するだけで右に回り込ませる*/
}

.cf:before,
.cf:after {
    content:"";
    display:table;
}
 
.cf:after {
    clear:both;
}
 
/* For IE 6/7 (trigger hasLayout) */
.cf {
    zoom:1;
}

.w-100 {
	width: 100%;
}

.mw-100 {
	max-width: 100%;
}

.mt10 {
	margin-top: 10px;
}

.mb10 {
	margin-bottom: 10px;
}

.pt10 {
	padding-top: 10px;
}

.pb10 {
	padding-bottom: 10px;
}

.f-bold {
	font-weight: bold;
}


/* header ---------------------------------------- */

/* footer ---------------------------------------- */

/* content ---------------------------------------- */

/* sidebar ---------------------------------------- */

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


.ac{
	text-align: center;

}


.ar {
	text-align: right;
}


 /* 幅480px以上のスタイル*/ 
@media screen and (min-width: 480px){
.sp-only{
	display:none;
}
}

 /* 幅480px以下のスタイル*/ 
@media screen and (max-width: 480px){

.sp-none{
	display:none;
}
}