/**************************************************************************************************************

    プロフィール / Profile

**************************************************************************************************************/

@media screen and (max-width:639px){

    #SuggestionBoxInner{
        margin: 20px auto;
    }
    
    
    #SuggestionBoxInner .h3-title{
        text-align: center;
        font-size: 14px;
        line-height: 32px;
        margin-bottom: 25px;
    }
    
    .messagebox-01{
        margin: 0 10px;
        line-height: 24px;
        font-size: 12px;
    }

    .marker{
    background:linear-gradient(transparent 75%, #ffdc00 75%);
    font-weight:bold; 
    }

    .inbox-merit,
    .inbox-flow{
        margin-top: 45px;
        background-color: #efefef;
        padding: 30px 25px 25px;
    }

    .inbox-feature h4,
    .inbox-merit h4,
    .inbox-flow h4{
        text-align: center;
        font-size: 14px;
        line-height: 30px;
      position: relative;
      margin-bottom: 2em;

    }

    .inbox-feature h4:before,
    .inbox-merit h4:before,
    .inbox-flow h4:before {
      content: '';
      position: absolute;
      left: 50%;
      bottom: -15px;/*線の上下位置*/
      display: inline-block;
      width: 60px;/*線の長さ*/
      height: 2px;/*線の太さ*/
      -moz-transform: translateX(-50%);
      -webkit-transform: translateX(-50%);
      -ms-transform: translateX(-50%);
      transform: translateX(-50%);/*位置調整*/
      background-color: black;/*線の色*/
      border-radius: 2px;/*線の丸み*/
    }

    

    .inbox-flow p{
        background:#49a85d;
        position:relative;
        font-size: 12px;
        color:#fff;
        padding:10px 20px;
        margin-bottom: 30px;
      border-radius: 5px;
    }

    /*擬似要素:after*/
    .inbox-flow p:after{
        content: ' ';
        width:0;
        height: 0;
        position:absolute;
        border:10px solid transparent;
        border-top-color:#49a85d;
        top:100%;
        left:50%;
    }

    .inbox-flow p:last-child:after{
        display: none;
    }

    
    .inbox-merit dl{
        margin-bottom: 18px;
    }

    .inbox-merit dl:last-child{
        margin-bottom: 0;
    }


    .inbox-merit dl dt{
        font-size: 14px;
        font-weight: bold;
        margin-bottom: 7px;
    }
    .inbox-merit dl dd{
        font-size: 12px;
        line-height: 20px;
    }


    .inbox-feature{
        padding: 30px 25px 0px;

    }
    
    .inbox-feature p{
        font-size: 12px;
        line-height: 20px;
    }
}




@media screen and (min-width:640px){
    

    .inbox-flow p{
        background:#49a85d;
        position:relative;

        /*テキストの補正*/
        color:#fff;
        padding:10px 20px;
        margin-bottom: 30px;
      border-radius: 5px;
    }

    /*擬似要素:after*/
    .inbox-flow p:after{
        content: ' ';
        width:0;
        height: 0;
        position:absolute;
        border:10px solid transparent;
        border-top-color:#49a85d;
        top:100%;
        left:50%;
    }

    .inbox-flow p:last-child:after{
        display: none;
    }




    .marker{
    background:linear-gradient(transparent 75%, #ffdc00 75%);
    font-weight:bold; 
    }



    .inbox-merit,
    .inbox-flow{
        margin-top: 45px;
        background-color: #efefef;
        padding: 30px 25px 25px;
    }

    .inbox-feature h4,
    .inbox-merit h4,
    .inbox-flow h4{
        text-align: center;
        font-size: 20px;
        line-height: 30px;
      position: relative;
      margin-bottom: 2em;

    }

    .inbox-feature h4:before,
    .inbox-merit h4:before,
    .inbox-flow h4:before {
      content: '';
      position: absolute;
      left: 50%;
      bottom: -15px;/*線の上下位置*/
      display: inline-block;
      width: 60px;/*線の長さ*/
      height: 2px;/*線の太さ*/
      -moz-transform: translateX(-50%);
      -webkit-transform: translateX(-50%);
      -ms-transform: translateX(-50%);
      transform: translateX(-50%);/*位置調整*/
      background-color: black;/*線の色*/
      border-radius: 2px;/*線の丸み*/
    }

    .inbox-merit dl{
        margin-bottom: 18px;
    }

    .inbox-merit dl:last-child{
        margin-bottom: 0;
    }


    .inbox-merit dl dt{
        font-size: 14px;
        font-weight: bold;
        margin-bottom: 7px;
    }



    #SuggestionBoxInner{
        width: 980px;
        margin: 40px auto;
    }

    #SuggestionBoxInner .h3-title{
        text-align: center;
        font-size: 24px;
        line-height: 32px;
        margin-bottom: 25px;
    }

    .messagebox-01{
        text-align: center;
        line-height: 32px;
    }



    .inbox-feature{
        margin-top: 45px;
        padding: 30px 25px 25px;

    }
}

