/** クラス名については
 * 他と同じにならないようにルールを決めて作成ください
 * 例： .pstory-[クラス名] */

/* @import url("post20190412.css");
/* @import url("post20190624.css");
/* @import url("post202002.css");

/*----------------プロジェクトストーリー----------------*/
/*--  プロジェクトについて　--*/
/*--  更新20190402　--*/
.p-project-intro{
    background-color:transparent;
    height:auto;
}
.pstory-project {
    width: 1000px;
    margin: 0px auto 70px;
    position: relative;
    background-color: #fff;
    /* padding: 45px 50px; */
    display: flex;
}
.pstory-project p {
    font-size: 14px;
    line-height: 24px;

}
/*-- テキストエリアイラストありで狭い場合　--*/
.pstory-project .txtarea{
    width: 68%;
    padding: 44px;
}
/*-- テキストエリア通常　--*/
.pstory-project .txtarea_full {
    width: 91%;
    padding: 44px;
}
.pstory-project .pstory-illust{

}
.pstory-project .pstory-illust02 {
width:270px;
}

/*--イロドリミドリ用--20200205 tbi*/
.pstory-project .pstory-illust03 {
    width: 350px;
    margin-top: 125px;
    margin-right: 20px;
}

.pstory-ttl-project {
    font-weight: 700;
    font-size: 28px;
    line-height: 38px;
    text-align: left;
}
/*-- タイトルイラストありで狭い場合　--*/
.pstory-title-wrapper{
    box-sizing: border-box;
    display: inline-block;
    padding: 0 40px 20px 0;
    border-bottom: 3px solid #000;
    margin-bottom:20px;
}
/*-- タイトル通常　--*/
.pstory-title-wrapper_full {
    box-sizing: border-box;
    padding: 0 40px 20px 0;
    border-bottom: 3px solid #000;
    margin-bottom: 20px;
}


p.txt {
    margin-bottom:15px;
}

.images{
        margin: -20px;
}
.images02{
    margin: -20px 50px -20px 0;
    width:270px;
    height:auto;
}

/*--  プロジェクトメンバー　--*/

.p-project-member {
    width: 900px;
    margin: 0 auto 70px;
    position: relative;
    padding: 30px 50px;
    height:auto;
    background-color: #fff;
}
.p-project-member .mds {
    display:flex;
    align-items:center;
    justify-content:center;
    background-color:#00b4ff;
    color:#fff;
    font-size:32px;
    font-weight:700;
    text-align:center;
    width:160px;
    height:160px;
    position:absolute;
    top:-20px;
    left:-20px;
}
.pstory-ttl-member {
    font-weight: 700;
    font-size: 23px;
    line-height: 38px;
    text-align: left;

}
.titlemember-wrapper{
    box-sizing: border-box;
    padding: 0 40px 20px 0;
    border-bottom: 3px solid #000;
    margin-bottom:20px;
}

.memberbox{
    width:750px;
    margin:10px 20px 20px 130px;
}

.member-group{
    display:flex;

}

.member-group p{
    width:60%;
    font-size:14px;
    line-height:24px;
}
.member-group .membername{
    width:40%;
    position:relative;

}
.member-group_default{


}

.member-group_default p{
    width:90%;
    font-size:14px;
    line-height:24px;
    margin: 0 auto 20px ;
}
.member-group_default .membername{
    width:100%;
    position:relative;

}
.member-group_default .mds_member {
    font-size:18px;
    font-weight:700;
    margin:0 auto 20px;

}






/*-- 後編　--*/
.member-group02{


}

.member-group02 p{
    width:90%;
    font-size:14px;
    line-height:24px;
    margin: 0 auto 20px ;
}
.member-group02 .membername{
    width:100%;
    position:relative;

}
.member-group02 .mds_member {
    font-size:18px;
    font-weight:700;
    margin:0 auto 20px;
    width:90%;

}



.flexbox {
    display:flex;
    justify-content:center;
}
.membername .col {
    display:flex;
    margin:0 10px ;
}

.membername .face {
    position: relative;
    width: 110px;
    height: 110px;
    overflow: hidden;
    border-radius: 55px;
}

.membername .face::after{
    box-sizing: border-box;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    content: "";
    border-radius: 50%;
    border: 3px solid #000;
}


/*-- ================メンバ-共通================--*/

.membername .face>img {
    width: 100%;
    height: auto;
}

.mds_member {
    font-size:18px;
    font-weight:700;
    margin-bottom:20px;
}

.membername .col dl{
    margin-left:10px;
    align-self :center;
}
.membername .col dt{
    font-size:18px;
    font-weight:700;
    margin-bottom:10px;
}

.membername .col dd{
    font-size:14px;
    font-weight:700;

}
/*-- ================メンバ-青================--*/
.col-blue .face::after {
    border-color: #009cff;
}
.col-blue dt,.col-blue dd{
    color:#009cff;
}

/*-- ================メンバ-緑================--*/
.col-green .face::after {
    border-color: #12ad4c;
}
.col-green dt,.col-green dd{
    color:#12ad4c;
}

/*-- ================メンバ-オレンジ================--*/

.col-orange .face::after {
    border-color: orange;
}
.col-orange dt,.col-orange dd{
    color:orange;
}
/*-- ================メンバ-赤================--*/
.col-red .face::after {
    border-color: #ff0000;
}
.col-red dt,.col-red dd{
    color:#ff0000;
}




@media screen and (max-width: 900px) {
    /** スマホ版スタイルはこの中に記述
     * サイズはvwを仕様してください
     * vwの計算は　「px / 750 * 100」
     * 例：フォントサイズ15pxの場合
     *     15 / 750 * 100 = 2vw */


    /*--  プロジェクトについて　--*/
.p-project-intro{
    background-color:transparent;
    height:auto;
}
.pstory-project {
    width: 100%;
    background-color: #fff;
    display:block;
    box-sizing:border-box;
    font-feature-settings : "palt";

    }

.pstory-project p {
    font-size: 3.2vw;
    line-height: 5.0666vw;
    width:79vw;
    margin:0 5vw 5vw;
}

.pstory-project .txtarea{
    padding:0;
    width:100%}


.pstory-project .txtarea_full{
    padding: 1vw;
    width: 100%}

.pstory-project .pstory-illust{
  width:100%;
    margin:2vw auto;
}
.pstory-project .pstory-illust02
{
    width: 80%;
    margin: -5px 9vw;}
.pstory-project .pstory-illust03
{
    width: 80%;
    margin: -5px 9vw;}

.pstory-ttl-project {
    font-weight: 700;
    font-size: 4.53333vw;
    line-height: 6.13333vw;
    text-align: left;
}

.pstory-title-wrapper{
    width: 79vw;
    padding-bottom: 1.86667vw;
    padding-left: 0;
    padding-right: 0;
    margin: 5vw;
    box-sizing: border-box;
}

.pstory-title-wrapper_full{
    width: 79vw;
    padding-bottom: 1.86667vw;
    padding-left: 0;
    padding-right: 0;
    margin: 5vw;
    box-sizing: border-box;
}


p.txt {
    margin-bottom:15px;
}

.images{
        margin: -20px;
}
.images02{
        margin: -20px auto;
}


/*--  プロジェクトメンバー　--*/

.p-project-member {
    width: 100%;
    margin: 0 auto;
    padding: 0;
    height: auto;
    font-feature-settings: "palt";

}
.p-project-member .mds {
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #00b4ff;
    color: #fff;
    font-size: 5.0666vw;
    font-weight: 700;
    text-align: center;
    width: 20.5333vw;
    height: 20.5333vw;
    position: absolute;
    top: -20px;
    left: -20px;
}
.pstory-ttl-member {
    width: 100%;
    /* margin-top: 15px; */
    font-weight: 700;
    font-size: 4vw;
    line-height: 5.3333vw;
    text-align: left;
    margin: 0;
    padding-bottom: 1.86667vw
}
.titlemember-wrapper{
box-sizing: border-box;
    padding: 4.666666vw 0 0 0;
    border-bottom: 3px solid #000;
    margin: 0 0 4.666666vw 19.3333vw;
    width: 64.66667vw;
    padding-bottom: 1.86667vw;
    padding-left: 0;
    padding-right: 0;
}

.memberbox{
    width: 100%;
    box-sizing: border-box;
    margin:0 auto;
}
    .member-group{
        display:block;
    }

.member-group_default{
    display: block;
    width: 100%;
    margin: 0;
    padding:10px 0 0 0;
    box-sizing:border-box;
}
.member-group02{
    display: block;
    width: 100%;
    margin: 0;
    box-sizing:border-box;
}


.flexbox{
    justify-content:space-around;
    padding:0 2.6666666vw;
    flex-wrap: wrap;
    }

.member-group p{
width: 100%;
    padding: 0 10px 0 20px;
    font-size: 3.2vw;
    line-height: 4vw;
    margin-bottom: 20px;
}
.member-group .membername{
width: 100%;
    position: relative;

}
.member-group02 p{
width: 80vw;
    font-size: 3.2vw;
    line-height: 4vw;
    margin:0 auto 20px auto;
}
.member-group_default p{
width: 80vw;
    font-size: 3.2vw;
    line-height: 4vw;
    margin:0 auto 20px auto;
}
.member-group_default .membername{
width: 100%;
    position: relative;
    padding: 4vw 0;
}


.membername .col {
    display: flex;
    padding: 0 0 20px;
    margin:0 auto;
    width:41.3333vw;
}

.membername .face {
    position: relative;
    width: 14.6666vw;
    height: 14.6666vw;
    overflow: hidden;
    border-radius: 7.3333vw;
}

.membername .face::after{
    box-sizing: border-box;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    content: "";
    border-radius: 7.3333vw;
    border: 3px solid #000;
}



.col-blue .face::after {
    border-color: #009cff;
}
.col-green .face::after {
    border-color: #12ad4c;
}

.col-orange .face::after {
    border-color: orange;
}
.col-red .face::after {
    border-color: #ff0000;
}


.membername .face>img {
    width: 100%;
    height: auto;
}

.mds_member {
    font-size:3.73333vw;
    font-weight: 900;
    margin-bottom: 20px;
    text-align: center;
}

.membername .col dl{
    margin-left: 2.26666666vw;
    align-self: center;
    width:24.6666vw;
}
.membername .col dt{
    font-size:3.7333vw;
    font-weight:700;
    margin-bottom:10px;
}

.membername .col dd{
    font-size:2.26vw;
    line-height:3.2vw;
    font-weight:700;

}

.col-blue dt,.col-blue dd{
    color:#009cff;
}
.col-orange dt,.col-orange dd{
    color:orange;
}

.col-green dt,.col-green dd{
    color:#12ad4c;
}

.col-red dt,.col-red dd{
    color:#ff0000;
}

}


/* 2020.09.08 */
#js-head {
	height: 0px;
	overflow: hidden;
}
.l-foot__links {
	height: 0px;
	padding-top: 30px;
	padding-bottom: 0px;
	overflow: hidden;
}
.atten_transportation {
	width: 70%;
	margin-left: auto;
	margin-right: auto;
	background: #ccc;
	padding: 20px 5%;
	font-size: 14px;
	line-height: 1.6;
}
.p-embed-map {
  height: 0px;
  overflow: hidden;
}

/* 2020.12.02 */
.sega_logo {
	position: absolute;
	top: 10px;
	left: 10px;
	width: 110px;
	max-width: 20%;
	z-index: 9999;
}
.sega_logo img,
.sega_logo_f img {
	width: 100%;
	height: auto;
	margin-right: 10px;
}
.sega_logo_f {
	width: 110px;
	max-width: 20%;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 20px
}