/*****************************************/
/*___________ 【commonstyle】 ___________ */
/*****************************************/

/*スマホ用とPC用に自動で画像のサイズを縮小・拡大*/
img {
max-width: 100%;
height:auto;
}

/*■■■■■オンマウスで画像が透過■■■■■*/
a:hover img {
opacity: 0.6;
filter: alpha(opacity=60);
} {
opacity: 0.6;
filter: alpha(opacity=60);
}
/*オンマウスで画像が透過させない*/
a:hover img.opa100 {
opacity: 1.0;
filter: alpha(opacity=100);
}




/*■■■■■文字の調整■■■■■*/
.mark_y{background: none repeat scroll 0 0 #ffff00;}/*マーカー*/
.ul{text-decoration: underline;}/*アンダーライン*/

.b{font-weight: bold;}/*太字*/
.red{color: red;}/*赤字*/
.tyuigaki {
 margin-left: 1em;
 text-indent: -1em;
}/*注意書き*/
.center{text-align:center;}/*中央揃え*/
.textr{text-align:right;}/*右揃え*/
.textl{text-align:left;}/*左揃え*/


@media screen and (max-width: 735px) {
    .center_switch {text-align:center;}
    .textr_switch {text-align:right;}
    .textl_switch {text-align:left;}
}


/*■■■■■position プロパティを使用した位置の調整■■■■■*/
.mother {position: relative;z-index: 1;}
.nest1 {position: absolute;z-index: 2;}/*最下層*/
.nest2 {position: absolute;z-index: 3;}
.nest3 {position: absolute;z-index: 4;}
/* ※nestのboxに対して topなどをあてる*/

/*
※.bottomの使用前提：親要素をposition:relative;にしてください。
*/
.top{vertical-align:top;}/*上揃え*/
.middle{vertical-align:middle;}/*中央揃え*/
.bottom{
    position : absolute ;
    bottom : 0 ;
}/*下揃え*/

/*■■■■■z-index レイヤーの調整■■■■■*/
.zi0 {z-index: 0;}
.zi1 {z-index: 1;}
.zi2 {z-index: 2;}
.zi3 {z-index: 3;}
.zi4 {z-index: 4;}
.zi5 {z-index: 5;}
.zi6 {z-index: 6;}
.zi7 {z-index: 7;}
.zi8 {z-index: 8;}
.zi9 {z-index: 9;}
.zi10 {z-index: 10;}


/*■■■■■マージンによる余白（px）■■■■■*/
.mt10{margin-top:10px;}
.mt20{margin-top:20px;}
.mt30{margin-top:30px;}
.mt40{margin-top:40px;}
.mt50{margin-top:50px;}
.mt60{margin-top:60px;}
.mt70{margin-top:70px;}
.mt80{margin-top:80px;}
.mt90{margin-top:90px;}
.mt100{margin-top:100px;}
.mb10{margin-bottom:10px;}
.mb20{margin-bottom:20px;}
.mb30{margin-bottom:30px;}
.mb40{margin-bottom:40px;}
.mb50{margin-bottom:50px;}
.mb60{margin-bottom:60px;}
.mb70{margin-bottom:70px;}
.mb80{margin-bottom:80px;}
.mb90{margin-bottom:90px;}
.mb100{margin-bottom:100px;}
.ml10{margin-left:10px;}
.ml20{margin-left:20px;}
.ml30{margin-left:30px;}
.ml40{margin-left:40px;}
.ml50{margin-left:50px;}
.ml60{margin-left:60px;}
.ml70{margin-left:70px;}
.ml80{margin-left:80px;}
.ml90{margin-left:90px;}
.ml100{margin-left:100px;}
.mr10{margin-right:10px;}
.mr20{margin-right:20px;}
.mr30{margin-right:30px;}
.mr40{margin-right:40px;}
.mr50{margin-right:50px;}
.mr60{margin-right:60px;}
.mr70{margin-right:70px;}
.mr80{margin-right:80px;}
.mr90{margin-right:90px;}
.mr100{margin-right:100px;}


/*■■■■■マージンによる余白（%）■■■■■*/
.mt1p{margin-top:1%;}
.mt2p{margin-top:2%;}
.mt3p{margin-top:3%;}
.mt4p{margin-top:4%;}
.mt5p{margin-top:5%;}
.mt6p{margin-top:6%;}
.mt7p{margin-top:7%;}
.mt8p{margin-top:8%;}
.mt9p{margin-top:9%;}
.mt10p{margin-top:10%;}
.mb1p{margin-bottom:1%;}
.mb2p{margin-bottom:2%;}
.mb3p{margin-bottom:3%;}
.mb4p{margin-bottom:4%;}
.mb5p{margin-bottom:5%;}
.mb6p{margin-bottom:6%;}
.mb7p{margin-bottom:7%;}
.mb8p{margin-bottom:8%;}
.mb9p{margin-bottom:9%;}
.mb10p{margin-bottom:10%;}
.ml1p{margin-left:1%;}
.ml2p{margin-left:2%;}
.ml3p{margin-left:3%;}
.ml4p{margin-left:4%;}
.ml5p{margin-left:5%;}
.ml6p{margin-left:6%;}
.ml7p{margin-left:7%;}
.ml8p{margin-left:8%;}
.ml9p{margin-left:9%;}
.ml10p{margin-left:10%;}
.mr1p{margin-right:1%;}
.mr2p{margin-right:2%;}
.mr3p{margin-right:3%;}
.mr4p{margin-right:4%;}
.mr5p{margin-right:5%;}
.mr6p{margin-right:6%;}
.mr7p{margin-right:7%;}
.mr8p{margin-right:8%;}
.mr9p{margin-right:9%;}
.mr10p{margin-right:10%;}


/*■■■■■paddingによる余白(px)■■■■■*/
.pt10{padding-top:10px;}
.pt20{padding-top:20px;}
.pt30{padding-top:30px;}
.pt40{padding-top:40px;}
.pt50{padding-top:50px;}
.pt60{padding-top:60px;}
.pt70{padding-top:70px;}
.pt80{padding-top:80px;}
.pt90{padding-top:90px;}
.pt100{padding-top:100px;}
.pb10{padding-bottom:10px;}
.pb20{padding-bottom:20px;}
.pb30{padding-bottom:30px;}
.pb40{padding-bottom:40px;}
.pb50{padding-bottom:50px;}
.pb60{padding-bottom:60px;}
.pb70{padding-bottom:70px;}
.pb80{padding-bottom:80px;}
.pb90{padding-bottom:90px;}
.pb100{padding-bottom:100px;}
.pl10{padding-left:10px;}
.pl20{padding-left:20px;}
.pl30{padding-left:30px;}
.pl40{padding-left:40px;}
.pl50{padding-left:50px;}
.pl60{padding-left:60px;}
.pl70{padding-left:70px;}
.pl80{padding-left:80px;}
.pl90{padding-left:90px;}
.pl100{padding-left:100px;}
.pr10{padding-right:10px;}
.pr20{padding-right:20px;}
.pr30{padding-right:30px;}
.pr40{padding-right:40px;}
.pr50{padding-right:50px;}
.pr60{padding-right:60px;}
.pr70{padding-right:70px;}
.pr80{padding-right:80px;}
.pr90{padding-right:90px;}
.pr100{padding-right:100px;}


/*■■■■■paddingによる余白(%)■■■■■*/
.pt1p{padding-top:1%;}
.pt2p{padding-top:2%;}
.pt3p{padding-top:3%;}
.pt4p{padding-top:4%;}
.pt5p{padding-top:5%;}
.pt6p{padding-top:6%;}
.pt7p{padding-top:7%;}
.pt8p{padding-top:8%;}
.pt9p{padding-top:9%;}
.pt10p{padding-top:10%;}
.pb1p{padding-bottom:1%;}
.pb2p{padding-bottom:2%;}
.pb3p{padding-bottom:3%;}
.pb4p{padding-bottom:4%;}
.pb5p{padding-bottom:5%;}
.pb6p{padding-bottom:6%;}
.pb7p{padding-bottom:7%;}
.pb8p{padding-bottom:8%;}
.pb9p{padding-bottom:9%;}
.pb10p{padding-bottom:10%;}
.pl1p{padding-left:1%;}
.pl2p{padding-left:2%;}
.pl3p{padding-left:3%;}
.pl4p{padding-left:4%;}
.pl5p{padding-left:5%;}
.pl6p{padding-left:6%;}
.pl7p{padding-left:7%;}
.pl8p{padding-left:8%;}
.pl9p{padding-left:9%;}
.pl10p{padding-left:10%;}
.pr1p{padding-right:1%;}
.pr2p{padding-right:2%;}
.pr3p{padding-right:3%;}
.pr4p{padding-right:4%;}
.pr5p{padding-right:5%;}
.pr6p{padding-right:6%;}
.pr7p{padding-right:7%;}
.pr8p{padding-right:8%;}
.pr9p{padding-right:9%;}
.pr10p{padding-right:10%;}


/*■フォントサイズ■*/
.fs_s{font-size: 1.4em;}
.fs_m{font-size: 1.6em;}
.fs_l{font-size: 1.8em;}
.fs05rem{font-size:0.5rem;}
.fs06rem{font-size:0.6rem;}
.fs07rem{font-size:0.7rem;}
.fs08rem{font-size:0.8rem;}
.fs09rem{font-size:0.9rem;}
.fs10rem{font-size:1.0rem;}
.fs11rem{font-size:1.1rem;}
.fs12rem{font-size:1.2rem;}
.fs13rem{font-size:1.3rem;}
.fs14rem{font-size:1.4rem;}
.fs15rem{font-size:1.5rem;}
.fs16rem{font-size:1.6rem;}
.fs17rem{font-size:1.7rem;}
.fs18rem{font-size:1.8rem;}
.fs19rem{font-size:1.9rem;}
.fs20rem{font-size:2.0rem;}

.readtxt{font-size:1.4rem;}

.copytxt{
    font-size:1.6rem;
    font-weight: bold;}
.ttltxt{
    font-size:1.8rem;
    font-weight: bold;}

/*■フォントサイズ(レスポンシブ対応)■*/
/* pc */
@media screen and (min-width: 736px) {
.fs_rsp_5{font-size:1.2rem;}
.fs_rsp_6{font-size:1.3rem;}
.fs_rsp_7{font-size:1.4rem;}
.fs_rsp_8{font-size:1.5rem;}
.fs_rsp_9{font-size:1.6rem;}
.fs_rsp_10{font-size:1.7rem;}
.fs_rsp_11{font-size:1.8rem;}
.fs_rsp_12{font-size:1.9rem;}
.fs_rsp_13{font-size:2.0rem;}
.fs_rsp_14{font-size:2.1rem;}
.fs_rsp_15{font-size:2.2rem;}
.fs_rsp_16{font-size:2.3rem;}
.fs_rsp_17{font-size:2.4rem;}
.fs_rsp_18{font-size:2.5rem;}
.fs_rsp_19{font-size:2.6rem;}
.fs_rsp_20{font-size:2.7rem;}
.fs_rsp_20{font-size:2.8rem;}
.fs_rsp_21{font-size:2.9rem;}
.fs_rsp_22{font-size:2.0rem;}
.fs_rsp_23{font-size:3.1rem;}
.fs_rsp_24{font-size:3.2rem;}
.fs_rsp_25{font-size:3.3rem;}
.fs_rsp_26{font-size:3.4rem;}
.fs_rsp_27{font-size:3.5rem;}
.fs_rsp_28{font-size:3.6rem;}
.fs_rsp_29{font-size:3.7rem;}
.fs_rsp_30{font-size:3.8rem;}
}
/* sp */
@media screen and (max-width: 735px) {
.fs_rsp_5{font-size:0.5rem;}
.fs_rsp_6{font-size:0.6rem;}
.fs_rsp_7{font-size:0.7rem;}
.fs_rsp_8{font-size:0.8rem;}
.fs_rsp_9{font-size:0.9rem;}
.fs_rsp_10{font-size:1.0rem;}
.fs_rsp_11{font-size:1.1rem;}
.fs_rsp_12{font-size:1.2rem;}
.fs_rsp_13{font-size:1.3rem;}
.fs_rsp_14{font-size:1.4rem;}
.fs_rsp_15{font-size:1.5rem;}
.fs_rsp_16{font-size:1.6rem;}
.fs_rsp_17{font-size:1.7rem;}
.fs_rsp_18{font-size:1.8rem;}
.fs_rsp_19{font-size:1.9rem;}
.fs_rsp_20{font-size:2.0rem;}
.fs_rsp_20{font-size:2.0rem;}
.fs_rsp_21{font-size:2.1rem;}
.fs_rsp_22{font-size:2.2rem;}
.fs_rsp_23{font-size:2.3rem;}
.fs_rsp_24{font-size:2.4rem;}
.fs_rsp_25{font-size:2.5rem;}
.fs_rsp_26{font-size:2.6rem;}
.fs_rsp_27{font-size:2.7rem;}
.fs_rsp_28{font-size:2.8rem;}
.fs_rsp_29{font-size:2.9rem;}
.fs_rsp_30{font-size:3.0rem;}
}



/*■■■■■位置の調整■■■■■*/

.mannaka {margin: auto;}/*真ん中に配置*/
.mannaka img {
    display: block;
    margin: auto;
}


/*■■■■■float関連■■■■■*/
.l{float: left;}/*float　left*/
.r{float: right;}/*float　right*/
.c{clear: both;}/*clear　both*/

/* ■■■■■clearfix ■■■■■*/
.clearfix{zoom:1;}
.clearfix:after{
    content:".";
    display:block;
    height:0px;
    clear:both;
    visibility:hidden;
    font-size: 0.1em;
}
/* WinIE7 MacIE5 */
.clearfix{
    display:inline-table;
    zoom:100%;
}
/* WinIE5-6 */
/* Hides from IE-mac \*/
* html html .clearfix{height:1px;}
.clearfix{display:block;}

/*■クリアフィックスによるカラム分け■*/
.twocolumns{width: 100%;}
.threecolumns{width: 100%;}
.fourcolumns{width: 100%;}
.twocolumns .l{width:50%;}
.threecolumns .l{width:33.3%;}
.fourcolumns .l{width:25%;}
.twocolumns .r{width:50%;}
.threecolumns .r{width:33.3%;}
.fourcolumns .r{width:25%;}


/*■flexbox■*/

/*親要素*/
.flexbox {display: flex;}
/*↓↓用途に応じて追記↓↓*/
.fbox-wrap {flex-wrap: wrap}/*子要素を折り返し、複数行に上から下へ並べる*/
.fbox-column {flex-direction: column}/*子要素を上から下に配置*/
.fbox-flex-end {justify-content: flex-end;}/*行末から配置。右揃え。*/
.fbox-center {justify-content: center;}/*中央揃え*/
.fbox-space-between {justify-content: space-between;}/*最初と最後の子要素を両端に配置し、残りの要素は均等に間隔をあけて配置*/
.fbox-space-around {justify-content: space-around;}/*両端の子要素も含め、均等に間隔をあけて配置*/
/*子要素*/
.fbox-column1_box .item {width: 100%;}
.fbox-column2_box .item {width: 49%;}
.fbox-column3_box .item {width: 32%;}
.fbox-column4_box .item {width: 23%;}
.fbox-column5_box .item {width: 19%;}

.fbox-column2_1 {flex:0 1 50%;}
.fbox-column3_1 {flex:0 1 32%;}
.fbox-column3_2 {flex:2 0 32%;}
.fbox-column4_1 {flex:0 1 23%;}
.fbox-column4_2 {flex:2 0 23%;}
.fbox-column4_3 {flex:3 0 23%;}
.fbox-column5_1 {flex:0 1 19%;}
.fbox-column5_2 {flex:2 0 19%;}
.fbox-column5_3 {flex:3 0 19%;}
.fbox-column5_4 {flex:4 0 19%;}


.flex_order1{order:1;}
.flex_order2{order:2;}
.flex_order3{order:3;}
.flex_order4{order:4;}
.flex_order5{order:5;}
.flex_order6{order:6;}
.flex_order7{order:7;}
.flex_order8{order:8;}
.flex_order9{order:9;}
.flex_order10{order:10;}

/*画面サイズによるスイッチ*/
@media screen and (max-width: 735px) {
.flexbox.switchFbox-wrap {flex-wrap: wrap}
.flexbox.switchFbox-row {flex-direction: row}
.flexbox.switchFbox-column {flex-direction: column}
.flexbox.switchFbox-flex-end {justify-content: flex-end;}
.flexbox.switchFbox-center {justify-content: center;}
.flexbox.switchFbox-space-between {justify-content: space-between;}
.flexbox.switchFbox-space-around {justify-content: space-around;}
.flexbox .switchflex_order1{order:1;}
.flexbox .switchflex_order2{order:2;}
.flexbox .switchflex_order3{order:3;}
.flexbox .switchflex_order4{order:4;}
.flexbox .switchflex_order5{order:5;}
.flexbox .switchflex_order6{order:6;}
.flexbox .switchflex_order7{order:7;}
.flexbox .switchflex_order8{order:8;}
.flexbox .switchflex_order9{order:9;}
.flexbox .switchflex_order10{order:10;}
.is-sp_w25p{width: 25%;}
.is-sp_w50p{width: 50%;}
.is-sp_w75p{width: 75%;}
}


/*■レスポンシブ■*/

/* pc */
@media screen and (min-width: 736px) {
    .is-sp {
    display: none;
    }
}
/* sp */
@media screen and (max-width: 735px) {
    .is-pc {
    display: none;
    }
}

/*___________ 【/commonstyle】 ___________ */


#wrap{
    margin:0 auto;
    max-width: 600px;
}


.container {
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
    background: #fff;
    /* box-shadow */
    box-shadow:0px 0px 22px -9px #555555;
}
