@charset "UTF-8";
/* about
-------------------------------------------------------------*/
body.about #main #content h3
,body.about #main #content h4 {
    margin: 0;
    padding: 0;
    border: none;
    background: none;
}

/* index
-------------------------------*/

/* points */
body.about #main #content .points dl dd ol li {
    position: relative;
    height: 1%; /* for IE6 and IE7 */
    margin: 20px 0;
    background: url(../img/about/about-bg-list-repeat.gif) repeat-y left top;
}

body.about #main #content .points dl dd ol li h4 {
    margin-bottom: 1em;
    padding: 19px 13px 0 156px;
    background: url(../img/about/about-bg-list-upper.gif) no-repeat left top;
}

body.about #main #content .points dl dd ol li p.image {
    position: absolute;
    margin: 13px 0 0 13px;
}

body.about #main #content .points dl dd ol li .text {
    min-height: 98px;
    _height: 98px; /* for IE6 */
    padding: 0 23px 3px 156px;
    background: url(../img/about/about-bg-list-bottom.gif) no-repeat left bottom;
}

/* works
-------------------------------*/

/* cloth */
body.about #main #content .cloth .column1-1 .leftbox {
    position: relative;
    width: 335px;
}

body.about #main #content .cloth .column1-1 .rightbox {
    width: 325px;
}

body.about #main #content .cloth .column1-1 .rightbox .text {
    margin-bottom: 2em;
    padding-left: 45px;
}

/* cloth details */
body.about #main #content .cloth .column1-1 .rightbox .details {
    background:  url(../img/about/works-bg-details-01.gif) no-repeat left top;
}

body.about #main #content .cloth .column1-1 .rightbox .details-inner {
    display: inline-block;
    background: url(../img/about/works-bg-details-03.gif) no-repeat left bottom;
}

body.about #main #content .cloth .column1-1 .rightbox .details-inner01 {
    display: inline-block;
    margin-left: 50px;
    _margin-left: 45px;
    background: #f9e2b8 url(../img/about/works-bg-details-02.gif) no-repeat right top;
}

body.about #main #content .cloth .column1-1 .rightbox .details ul {
    display: inline-block;
    padding-top: 15px;
    padding-right: 5px;
    background: url(../img/about/works-bg-details-04.gif) no-repeat right bottom;
}

body.about #main #content .cloth .column1-1 .rightbox .details ul li {
    float: left;
    width: 125px;
    padding-bottom: 5px;
    text-align: center;
    margin: 0 5px;
}

/* cloth details-1column */
body.about #main #content .cloth .column1-1 .rightbox .details-1column {
    background:  url(../img/about/works-bg-details-01.gif) no-repeat left top;
}

body.about #main #content .cloth .column1-1 .rightbox .details-1column .details-inner {
    display: inline-block;
    _width: 140px;
    background: url(../img/about/works-bg-details-03.gif) no-repeat left bottom;
}

body.about #main #content .cloth .column1-1 .rightbox .details-1column .details-inner01 {
    display: inline-block;
    _width: 140px;
    margin-left: 50px;
    _margin-left: 45px;
    background: #f9e2b8 url(../img/about/works-bg-details-02.gif) no-repeat right top;
}

body.about #main #content .cloth .column1-1 .rightbox .details-1column ul {
    display: inline-block;
    _width: 135px;
    padding-top: 15px;
    padding-right: 5px;
    background: url(../img/about/works-bg-details-04.gif) no-repeat right bottom;
}

body.about #main #content .cloth .column1-1 .rightbox .details-1column ul li {
    float: left;
    width: 125px;
    padding-bottom: 5px;
    text-align: center;
    margin: 0 5px;
}

body.about #main #content .cloth .column1-1 .rightbox .details ul li img {
    margin-bottom: 0.5em;
}

/* comment */
body.about #main #content .comment {
    padding-bottom: 5px;
    margin-bottom: 1em;
    background: #f1f1f1 url(../img/about/works-bg-comment-bottom.gif) no-repeat left bottom;
}

body.about #main #content .comment .comment-title {
    padding: 13px 12px 0;
    background: url(../img/about/works-bg-comment-upper.gif) no-repeat left top;
}

body.about #main #content .comment .comment-title h3 {
    padding: 0 0 5px 30px;
    border-bottom: 1px dotted #333;
    background: url(../img/about/works-icon-comment.gif) no-repeat left top;
}

body.about #main #content .comment .leftbox {
    width: 458px;
}

body.about #main #content .comment .rightbox {
    width: 141px;
    margin: 12px 12px 0 0;
}

body.about #main #content .comment dl {
    margin: 1em 12px;
}

body.about #main #content .comment dl dt {
    margin-bottom: 0.5em;
}

body.about #main #content .comment dl dd {
    margin-bottom: 1em;
}






/* font-size sample */
/*
    default = 12px
    24px = 200%
    23px = 192%
    22px = 183%
    21px = 175%
    20px = 166%
    19px = 158%
    18px = 150%
    17px = 142%
    16px = 133%
    15px = 125%
    14px = 117%
    13px = 108%
    11px = 92%
    10px = 84%
    9px = 75%
    8px = 67%
    7px = 58%
*/


.sp {
    display: none;
}

/*スマホ
------------------------------*/

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

    .pc {
        display: none;
    }
    .sp {
        display: block;
    }

    /* index
-------------------------------*/

/* points */
body.about #main #content .points dl dd ol li {
    position: static;
    height:auto; /* for IE6 and IE7 */
    margin: 3% 0;
    background:none;
    border: #ccc 2px solid;
    padding: 3%;
    border-radius: 10px;
}

body.about #main #content .points dl dd ol li h4 {
    margin-bottom:2%;
    padding:0;
    background:none;
}

body.about #main #content .points dl dd ol li p.image {
    position: static;
    margin:0 auto 2%;
    text-align: center;
}

body.about #main #content .points dl dd ol li .text {
    min-height:auto;
    _height: 98px; /* for IE6 */
    padding: 00;
    background:none;
}


}