@charset "utf-8";

/* ****************************************************
Title: aboutus.css
---------------------------------------------------------------------------- */
.page_title {width: 419px;}
#contents .txt {width: 567px;margin: 0 auto 100px;}
.cont {position: relative;width: 1000px;margin: 0 auto;height: 200px;margin-bottom: 70px;}
.cont .bar {position:  absolute;top: 20px;left: 0px;}
.sec_img {position:  absolute;}

/* =============================
 .section1
==============================*/
.sec01 .wrap {width: 940px;padding: 90px 20px 30px;background: #F2F2F2;margin-left: 20px;}
.sec01 .sec_txt {width: 560px;}
.circle11 {top: -50px;right: 200px;}
.circle12 {top: 10px;right: 5px;}

/* =============================
 .section2
==============================*/
.sec02 .bar {position: absolute;top: 20px; right: 0px; left: inherit;}
.sec02 .wrap {width: 940px;padding: 90px 20px 20px;background: #F2F2F2;margin-right: 20px;}
.sec02 .sec_txt {text-align: right;}
.circle21{top: -40px;left: 50px;}

/* =============================
 .sectio3
==============================*/
.sec03 .wrap {width: 940px;padding: 90px 20px 20px;background: #F2F2F2;margin-left: 20px;}
.sec03 .sec_txt {width: 560px;}
.circle31 {top: -50px;right: 200px;}
.circle32 {top: 10px;right: 5px;}



@media screen and (max-width: 740px) {
.page_title {width: 95%;}
.page_title img {width: 100%;}
#contents .txt {margin: 0 auto 2em; width: 100%;}
#contents .txt img {width: 85%;margin-left: auto;margin-right: auto;display: block;}
.cont {width: 100%;height: auto;margin: 0 auto 2em;}
.cont .bar {margin-left: 1%;}
.cont .bar img {width:98%;}
.sec_img {position: inherit;}
/* =============================
 .section1
==============================*/
.sec01 .wrap {width: 80%;margin-left: 4%;padding: 15% 5.5% 20px;}
.sec01 .sec_txt {width: 100%;margin-bottom: 1em;}
.circle11,.circle12 {top: inherit;right: inherit; width: 50%;}
.circle11 img,.circle12 img {width: 100%;}

    
/* =============================
 .section2
==============================*/
.sec02 .wrap {width: 80%;margin-right: inherit;margin-left: 4%;padding:  15% 5.5% 20px;}
.sec02 .sec_txt {text-align: left;margin-bottom: 1em;}
.circle21{top: inherit;left: inherit;}
.circle21 img {width: 100%;}

/* =============================
 .sectio3
==============================*/
.sec03 .wrap{width: 80%;margin-left: 4%;padding:  15% 5.5% 20px;}
.sec03 .sec_txt {width: 100%;margin-bottom: 1em;}
.circle31,.circle32 {top: inherit;right: inherit; width: 50%;}
.circle31 img,.circle32 img {width: 100%;}

}