@charset "utf-8";






body,body.home {
 color             : #505050;
 background-color  : #ffffff;
 font-size         : 13px;
 letter-spacing    : 0.05em;
 padding           : 0 10px 0 10px;
}

.codepc{ display:inline; }
.codesp{ display:none; }




/*-------------------------------------------
メイン
-------------------------------------------*/

/* コンテンツ部分の構成 */
#container {
 margin            : 0px auto;
 width             : 100%;
 text-align        : center;
}

#content{
 clear             : both;
 display           : block;
 margin            : 0px auto;
 padding           : 10px 0 10px 0;
 width             : 600px;
 text-align        : left;
 background        : #ffffff;
}
#content:after {
 content: "";
 display: block;
 clear: both;
}

#content2{
 clear             : both;
 display           : block;
 margin            : 0px auto;
 padding           : 10px 0 10px 0;
 width             : 600px;
 text-align        : left;
 min-height        : 500px;
 background-image  : url("../img/bg_concept_sp2.png");
 background-repeat : no-repeat;
 background-position:right bottom;
 line-height       : 200%;
}
#content2:after {
 content: "";
 display: block;
 clear: both;
}



#content .area,
#content2 .area{
 float             : left;
 display           : inline;
 margin            : 0 20px 0 20px;
 padding           : 0 0 0 0;
}

#content .txt,
#content2 .txt{
 float             : left;
 display           : inline;
 margin            : 10px 20px 0 20px;
 padding           : 0 0 0 0;
}

#content .txt p,
#content2 .txt p{
 float             : left;
 display           : inline;
 margin            : 10px 0 0 0;
 padding           : 0 0 0 0;
}


.story{
 float             : left;
 display           : inline;
 margin            : 10px 0 0 0;
 padding           : 10px 10px 10px 10px;
 border            : 2px solid #b0dff8;
 border-radius     : 10px;
}






.mds1{
 float             : left;
 display           : inline;
 margin            : 36px 0 0 0;
 padding           : 0 0 0 0;
 font-size         : 24px;
 font-weight       : bold;
 width             : 100%;
 color             : #636363;
}

.mds2{
 float             : left;
 display           : inline;
 margin            : 12px 0 6px 0;
 padding           : 0 0 0 0;
 font-size         : 16px;
 font-weight       : bold;
 width             : 100%;
}





















/* ipad以下のサイズはスマホレイアウトへ ///////////////////////////////////////////////////////// */



@media (max-width: 778px) {

body,body.home {
 color             : #505050;
 background-color  : #ffffff;
 font-size         : 0.8em;
 line-height       : 1.4em;
 letter-spacing    : 0em;
}

.codepc{ display:none; }
.codesp{ display:inline; }




/*-------------------------------------------
メイン
-------------------------------------------*/

/* コンテンツ部分の構成 */
#container {
 margin            : 0px auto;
 width             : 100%;
 text-align        : center;
}

#content{
 clear             : both;
 display           : block;
 margin            : 0px auto;
 padding           : 1em 0 2em 0;
 width             : 100%;
 color             : #666666;
}
#content:after {
 content: "";
 display: block;
 clear: both;
}

#content2{
 clear             : both;
 display           : block;
 margin            : 0px auto;
 padding           : 1em 0 2em 0;
 width             : 100%;
 color             : #666666;
 background-image  : url("../img/bg_concept_sp.png");
 background-repeat : no-repeat;
}
#content2:after {
 content: "";
 display: block;
 clear: both;
}



#content .area,
#content2 .area{
 float             : left;
 display           : inline;
 margin            : 0 1em 0 1em;
 padding           : 0 0 0 0;
}

#content .txt,
#content2 .txt{
 float             : left;
 display           : inline;
 margin            : 1em 1em 1em 1em;
 padding           : 0 0 0 0;
}
#content .txt p,
#content2 .txt p{
 float             : left;
 display           : inline;
 margin            : 10px 0 0 0;
 padding           : 0 0 0 0;
}


.story{
 float             : left;
 display           : inline;
 margin            : 10px 0 0 0;
 padding           : 10px 10px 10px 10px;
 border            : 2px solid #b0dff8;
 border-radius     : 10px;
}



.mds1{
 float             : left;
 display           : inline;
 margin            : 2em 0 0 0;
 padding           : 0 0 0 0;
 font-size         : 1.2em;
 font-weight       : bold;
 width             : 100%;
 color             : #636363;
}

.mds2{
 float             : left;
 display           : inline;
 margin            : 1em 0 0.5em 0;
 padding           : 0 0 0 0;
 font-size         : 1em;
 font-weight       : bold;
 width             : 100%;
}




}/* @media (max-width: 778px) */